1. General basics
Main tabs
- Screen Editor – full ZX screen editing with bitmap, attributes, selections, layers, text objects, and dithering. Also supports Next Layer 2 mode.
- Sprite Editor – sprite frames, optional masks, animation preview, BIN/ASM export. Also supports Next 8bpp/4bpp sprite mode.
- Font Editor – font or UDG editing, glyph transforms, preview, BIN/ASM export.
How drawing works
- Left mouse button draws or confirms the current tool operation.
- Right mouse button erases in bitmap-based editors.
- Middle mouse button samples the visible attribute (classic) or color index (Next) under the cursor in Screen Editor.
- Selections can become floating selections that can be moved before being committed.
- All drawing tools use Bresenham interpolation on drag, so no pixels are skipped even on fast movements.
| Concept | Meaning |
|---|---|
| INK | Foreground color (classic ZX: 0–7, bright variants via Bright flag). |
| PAPER | Background color. |
| Bright | Uses bright variants of the ZX palette. |
| Flash | Sets the ZX FLASH attribute bit. |
| Mask | Auxiliary per-pixel layer for sprites and fonts. |
| Text layer | A live, editable text object that appears as a separate entry in the Layers panel and is rendered on top of bitmap layers. |
| ASM preview | Generated assembly text preview of current data, updated after each stroke. |
| Layer 2 | ZX Spectrum Next full-color screen mode — 256×192, 256-color indexed palette, no attribute grid. |
| NXI | Next screen file format: 49152 bytes of pixel data + optional 512-byte palette. |
| SL2 | Alternative Next Layer 2 binary format (raw pixel data only, no header). |
2. Screen Editor
The Screen Editor is the main workspace for building a ZX Spectrum screen. It combines a 256×192 bitmap, a 32×24 attribute layer, selection tools, paint tools, dithering, text objects, layer management, and SCR/ATTR/NXI import-export. Switch between classic ZX and Next Layer 2 modes via the screen mode selector at the top.
Top controls
| Control | What it does | How to use it |
|---|---|---|
| Screen name | Name of the current screen item. | Type directly into the text field. |
| Screen mode | Switches between Classic ZX Spectrum and ZX Spectrum Next Layer 2. When switching modes, text object colors are automatically converted to the nearest equivalent. | Select from the dropdown. Switching converts the current canvas including all text layers. |
| ↶ Undo / ↷ Redo | Undo or restore the last action. | Use the buttons or Ctrl+Z / Ctrl+Y. |
| − / + | Zoom out or in. | Use buttons or keyboard shortcuts. |
| ? | Opens the help dialog. | Click once. |
| Status | Shows what the editor is currently doing. | Read-only. |
Toolbox
| Group | Tools | Purpose |
|---|---|---|
| Selection | Rect sel, Oval sel, Free sel, Move | Create and manipulate selected areas. Move turns a selection into a floating selection that can be dragged before committing. |
| Draw | Pencil, Brush, Erase, Spray, Line, Text | Bitmap drawing and direct painting. Spray applies continuously on drag. Text places editable text objects directly on the canvas. |
| Shapes | Rect, Fill rect, Ellipse, Fill oval | Drag-based geometric drawing with live preview while dragging. |
| Paint & Color | Fill, Dither, Attr, Pick | Fill areas, apply dithering, paint attribute cells, or sample values from the canvas. |
Canvas and color controls
| Control | Meaning | How to use it |
|---|---|---|
| Show Attrs / Layer 2 | Toggles attribute coloring (classic) or shows Layer 2 label (Next). | In classic mode: useful when checking ZX color clash. |
| INK swatches | Select foreground color (classic mode). While a text object is being edited, clicking an INK swatch instantly changes its color. | Click one of the 8 ZX colors. In Next mode, use the 256-color palette grid. |
| PAPER swatches | Select background color (classic mode only). | Click one of the 8 ZX colors. |
| Bright | Attribute switch (classic mode). While a text object is being edited, toggling Bright instantly updates its color. | Toggle on or off. |
| Flash | Attribute switch (classic mode only). | Toggle on or off. |
| Transparent PAPER | Makes the current layer background transparent in the current 8×8 attribute cell. | Best used on upper layers in classic mode. Not available in Next mode. |
| INK ⇄ PAPER | Swaps the current foreground and background colors. | Useful for fast color inversion. |
| Hover attr | Shows the final visible INK/PAPER under the cursor (classic) or color index (Next). | Useful when working with multiple layers. |
| Brush / Spray / Density | Tool-specific sliders for size and density. | Adjust to match the active tool. |
| Dither len. | Controls the fade-out distance of the Dither tool stroke. | Higher values produce a longer gradient trail. |
| Dither mode | Selects the dither pattern: Solid, Checker, Sparse, or Radial. | Choose from the dropdown next to the Dither length slider. |
| Attr Only | Edits only the 32×24 attribute map (classic mode only). | Use for recoloring without changing bitmap pixels. Left-click writes the current INK+PAPER. Right-click writes with INK and PAPER swapped — useful for quickly inverting a cell's colors without changing the editor palette. |
| 1×1 / 8×8 | Grid overlays (classic mode only). | Use 1×1 for pixel precision and 8×8 for attribute planning. |
Text tool
Basic usage
- Select the Text tool from the Draw group in the toolbox.
- Click anywhere on the canvas — a floating editor box appears and gets focus immediately. Start typing right away.
- The text is rendered live on the canvas as you type — no need to confirm to see it.
- Press Ctrl+Enter or Esc to close the editor box. Clicking elsewhere on the canvas also closes it.
Text editor box
When editing, a floating editor box appears near the text. It has a drag handle (⠿) at the top — grab it to drag the editor anywhere in the canvas area so it doesn't cover what you're working on. The editor box is positioned automatically below or above the text depending on available space.
| Control / shortcut | What it does |
|---|---|
| Ctrl+Enter | Closes the text editor and confirms all edits. The text remains as a live layer. |
| Esc | Closes the text editor. Edits are preserved (text is stored live on every keystroke). |
| Click on canvas | Closes the text editor without creating a new text object at the click position. |
| Drag the ⠿ handle | Moves the editor box to any position within the canvas area. |
| Multiline support | Press Enter inside the editor for multi-line text. |
Text tool panel
When the Text tool is active, a panel appears below the canvas controls with the following options:
| Option | What it does |
|---|---|
| Font | Choose between Tiny 5×7 (compact pixel font), ZX ROM 8×8 (the original ZX Spectrum font), or Font editor (uses the font currently open in the Font Editor tab). |
| Bold | Renders each glyph one pixel wider for a bold effect. |
| Italic | Applies a slight horizontal slant to each glyph. |
| Delete text | Permanently removes the currently selected text object. |
Changing text color
| Mode | How to change color |
|---|---|
| Classic ZX mode | While the text editor is open, click any INK swatch or toggle Bright — the text color updates instantly. The selected INK + Bright combination becomes the text color. |
| Next Layer 2 mode | While the text editor is open, click any color in the 256-color palette grid or the quick-pick row — the text color updates instantly to that palette index. |
Moving text on the canvas
With the Text tool active, click and drag any existing text object on the canvas to reposition it. The text moves in real time. You can also move it via the Layers panel — select the text layer and use the Up/Down buttons.
Editing existing text
With the Text tool active, double-click any text object on the canvas (or click the ✎ button next to it in the Layers panel) to reopen the editor box and change the content.
Next Layer 2 mode
In Next mode the 256×192 canvas uses a fully indexed 256-color palette — no attribute grid, no INK/PAPER, no color clash. Each pixel stores a palette index (0–255). This maps directly to the ZX Spectrum Next Layer 2 screen format.
| Feature | Description |
|---|---|
| 256-color palette | The palette grid shows all 256 Next colors. Left-click assigns Color A (main draw color), right-click assigns Color B (secondary / erase color). |
| Color A / Color B chips | The two chips above the palette show the currently selected Next indices, their swatches, and numeric palette IDs. |
| Middle mouse | Middle-click on the canvas samples the color index under the cursor and assigns it to the active draw color. |
| Text color in Next mode | While editing a text object, clicking any color in the palette instantly changes the text color to that palette index. |
| Next preview adjustments | Below the palette are three live preview sliders: Brightness, Contrast, and Saturation (all −100…+100). They affect only the Screen Editor preview until applied. |
| Apply to layer | Commits the current Brightness / Contrast / Saturation preview changes permanently into the active Next bitmap layer. The editor remaps each painted pixel to the nearest Next palette entry and then resets the sliders back to 0. |
| Reset | Clears the Next preview adjustment sliders back to zero without modifying layer data. |
| Import L2 | Loads a raw Layer 2 file (49152 bytes of 8bpp indexed data, no header). Replaces the canvas pixel data. |
| Export L2 Raw | Exports 49152 bytes of raw indexed pixel data. Load directly into Next Layer 2 memory at address $C000 (bank 8). |
| Export PAL | Exports the 512-byte Next palette block (256 × 2 bytes in RRRGGGBB + B format). |
| Export SL2 | Exports an SL2 file — same pixel layout as L2 Raw, alternative extension used by some Next tools. |
| Export NXI | Exports an NXI file: 49152 bytes of pixel data followed by the 512-byte palette. This is the most complete Next screen format and can be loaded directly by NextBASIC or Z80 loaders. |
| Export NXI + NXP (compat) | Exports a compatibility pair for workflows that want screen data and palette as separate files. |
| Import NXI | Loads an NXI file. If the file contains palette data (≥ 49664 bytes) it is also applied to the editor palette. |
| Convert to Next | Converts the current classic ZX screen to Next Layer 2 format. Text object colors are also converted to the nearest Next palette index. |
| Convert to Classic | Converts the current Next Layer 2 canvas back to classic ZX Spectrum format. A conversion dialog appears with a live before/after preview and the following options: Method: Direct conversion (nearest ZX colour per pixel, fast) or Dithering — Ordered Bayer (dot patterns simulate mid-tones within each 8×8 attribute cell). Dither strength (0–100 %): how strongly the Bayer pattern is applied. At 0 % it behaves like direct conversion; at 100 % full dithering is used. Matrix: Bayer 2×2 (finer), 4×4 (recommended), or 8×8 (coarser texture). Brightness / Contrast / Saturation (-100…+100): pre-process the source image before conversion. The preview updates live as you move the sliders. Text object palette indices are mapped to the nearest ZX ink color. |
LOAD "screen.nxi" LAYER 2 or from Z80 with a standard Layer 2 loader. The NXI format bundles pixels and palette together so the colors are exactly as you designed them.Layers and text layers
The Layers panel shows all bitmap layers and all text objects together in a unified list. Bitmap layers are marked with a filled square (⬛); text layers are marked with a blue T badge and show a preview of their content in quotes.
| Control | Applies to | What it does |
|---|---|---|
| Add | Bitmap | Creates a new bitmap layer with transparent attributes. |
| Duplicate | Both | Copies the active layer. For text layers, creates a copy offset by 4 pixels. |
| Delete | Both | Deletes the active layer or text object (with confirmation). At least one bitmap layer always remains. |
| Clear | Bitmap | Clears all pixels and attributes from the active bitmap layer. |
| ↑ Up / ↓ Down | Both | Changes layer order. For text layers, changes their z-order relative to other text objects. |
| Merge Layers | Both | Merges all visible bitmap layers into one, and rasterizes all visible text objects into the merged result. Text objects are permanently converted to pixels — use Undo to reverse. |
| Rename (✎) | Bitmap | Opens a dialog to rename the selected bitmap layer. |
| Edit text (✎) | Text | Opens the text editor box for the selected text layer. |
| Visibility checkbox | Both | Shows or hides a layer. Hidden text layers are excluded from rendering and exports. |
| Click on layer name | Bitmap | Activates the layer for drawing. |
| Click on text layer | Text | Selects the text object and switches to the Text tool. |
| Double-click on text layer | Text | Opens the text editor box immediately. |
Selection panel
| Control | What it does | When to use it |
|---|---|---|
| Copy / Paste / Cut | Clipboard-based selection operations on bitmap data. | Use for duplication and repositioning of bitmap content. |
| To Layer | Moves or copies selected content into a new layer. | Useful for separating screen elements. |
| Delete | Deletes the selected contents. | Use after confirming the selected area. |
| Move | Turns the selection into a movable floating selection. | Use for repositioning. |
| Move 8 px | Snaps movement to 8-pixel steps. | Useful for attribute-aligned placement. |
Import / export / project files
When loading a project with Load Project, a progress overlay shows the loading stages. This is useful for large projects with many layers or text objects.
| Control | Mode | Purpose |
|---|---|---|
| Import Image | Both | Converts a regular image (JPG, PNG, …) to ZX-compatible screen data. In classic ZX mode a conversion dialog appears with a live before/after preview and these options: Method: Direct conversion (two most common ZX colours per 8×8 cell) or Dithering — Ordered Bayer (dot patterns simulate gradients and mid-tones). Dither strength (0–100 %): intensity of the Bayer pattern. Matrix: Bayer 2×2 / 4×4 / 8×8. Brightness / Contrast / Saturation (-100…+100): adjust the image before conversion. The preview canvas updates live. In Next mode the image is converted directly to the nearest Next palette index (no dialog). |
| Import SCR / Import L2 | Classic / Next | Loads SCR/BIN screen data (classic) or raw 49152-byte Layer 2 data (Next). |
| Export SCR / Export L2 Raw | Classic / Next | Exports a standard 6912-byte SCR (classic) or raw Layer 2 pixel data (Next). Text objects are baked into the exported image. |
| Export ATTR / Export PAL | Classic / Next | Exports only the attribute block (classic) or the 512-byte Next palette (Next). |
| Export SL2 | Next only | Exports an SL2 file (raw Layer 2 data, alternative extension). |
| Export NXI | Next only | Exports pixels + palette as a single NXI file. Text is baked in. |
| Import NXI | Next only | Loads an NXI file including its palette. |
| Save Project / Load Project | Both | Saves or loads project JSON with all editor state including text layers. Load shows a progress bar overlay. |
3. Sprite Editor
The Sprite Editor handles frame-based sprite work. It supports two main modes: Classic ZX Spectrum (1bpp monochrome or color with ZX attributes) and ZX Spectrum Next 8bpp (indexed 256-color). Select the mode from the Sprite mode dropdown in the setup panel.
Classic ZX sprite mode
| Area | What it does |
|---|---|
| Sprite setup | Set sprite name, palette, bright, width (multiples of 8), height (any), zoom, monochrome/color mode, mask and grid. |
| Monochrome / Color | Monochrome stores only a 1bpp bitmap. Color additionally stores a ZX attribute per 8×8 cell. |
| Mask: ON/OFF | When on, generates or lets you manually edit a 1bpp mask (1 = transparent, 0 = opaque). Classic sprite routines use OR/AND masking. |
| Frame controls | New Frame, Duplicate Frame, Delete Frame — build multi-frame animations. |
| Sprite canvas | Left draws, right erases. Dragging interpolates missing pixels. Middle-click picks color. |
| Mask panel | Edit mask pixels manually. Restore auto-generated mask with ↺ Auto. |
| Animation preview | Plays frames at the configured delay (ms). |
| Export BIN | Binary export of all frames: bitmap rows then mask rows per frame. |
| Export ASM | Assembly DB listing, one row per line, with frame labels and optional mask. |
| Import ASM / BIN | Re-imports previously exported data back into frames. |
Next 8bpp sprite mode
In Next mode each pixel stores a palette index (0–255). Index 0 is the hardware transparent color by default. The editor uses the 256-color Next palette for drawing.
| Feature | Description |
|---|---|
| Width / Height | Both must be multiples of 16 (step 16). Minimum 16×16. The Next hardware sprite unit is always 16×16 pixels. |
| 256-color palette | Left-click a color to set the draw color. Right-click to set the transparent index. |
| Middle mouse on canvas | Picks the color index under the cursor. |
| Transparent index | Pixels with this index are treated as transparent by the Next sprite hardware. Default is index 0. |
| Export Next SPR | Exports an SPR file. For a 16×16 sprite: 256 bytes. For larger sprites see below. |
| Export ASM | DB listing in Next 8bpp format with sub-sprite labels for multi-tile sprites. |
| Export format | 8bpp raw — one byte per pixel (standard). 4bpp packed — two pixels per byte (uses hw4 format, 128 bytes per 16×16 tile). |
Large / multi-tile sprites
The ZX Spectrum Next hardware supports only 16×16 pixel sprites. To create larger characters or objects you combine multiple hardware sprites, each 16×16, positioned adjacent to each other in software.
The editor supports this directly: set any canvas size that is a multiple of 16 in both dimensions (e.g. 32×32, 32×48, 64×64). The editor then:
- Draws the info badge showing the sub-sprite grid, e.g. "Next sprite: 2×2 = 4× 16×16 sub-sprites".
- SPR export outputs all hardware tiles sequentially: left-to-right, top-to-bottom. A 32×32 sprite produces 4 × 256 = 1024 bytes (8bpp), ready for
SPRITE CONTINUEcalls. - ASM export produces a separate label for each 16×16 tile:
sprite_frame0_sub0_0:,sub1,sub2, etc., with a comment showing the pixel offset of each tile.
SPRITE N,X,Y,PAL,ID for the first tile, then SPRITE CONTINUE for subsequent tiles at X+16, X+32 offsets. The SPR file from this editor is laid out in exactly the order Next expects for sequential loading.4. Font Editor
The Font Editor manages either the standard character set (32..127) or UDGs (A..U). It supports glyph editing, mask editing, transforms, ZX ROM import, and ASM preview. The active font in the Font Editor can be used directly by the Text tool in the Screen Editor — select Font editor from the Text tool font dropdown.
| Area | What it does |
|---|---|
| Font setup | Set font name, width, height, zoom, mask mode, and grid. |
| Glyph tools | Shift and rotate the active glyph or the entire set; load ZX 8×8; import ROM/CH8/ASM-like input. |
| Character set | Switch between standard printable characters and UDGs. |
| Glyph canvas | Main glyph editor. Left-click draws; right-click erases. |
| Mask editor | Works like sprite mask editing when mask mode is enabled. |
| Preview / Export | Large preview, mask preview, ASM preview, plus BIN/ASM import-export for both font and UDG sets. |
| Use in Screen Editor | Select Font editor from the Text tool's font dropdown to render screen text using the currently edited font. |
5. Keyboard and mouse controls
| Shortcut / control | Action |
|---|---|
| Left mouse | Draw / place / confirm most editor actions. In Text tool: click canvas to create a new text object with immediate focus. |
| Right mouse | Erase in bitmap editors. In Attr Only mode: writes the current attribute with INK and PAPER swapped — useful for inverting cell colors. In Next sprite mode: sets the transparent color index. |
| Middle mouse | Screen Editor: samples the visible attribute (classic) or color index (Next) under the cursor. Next Sprite Editor: picks the color index under the cursor. |
| Ctrl + Z | Undo. |
| Ctrl + Y | Redo. |
| Ctrl + Shift + Z | Redo. |
| Ctrl + C / V / X | Copy / Paste / Cut selection in Screen Editor. |
| Enter / Esc | Commit / cancel floating selection. In text editor: Esc closes the text editor box. |
| Ctrl + Enter | Confirm and close the text editor box. |
| Delete / Backspace | Deletes the active text object when the Text tool is selected and no editor box is open. |
| + / - | Zoom in / out in Screen Editor. |
| W A S D | Scroll around the zoomed screen canvas. |
6. Recommended workflows
Classic full-screen workflow
- Start in Screen Editor (Classic ZX Spectrum mode).
- Set INK, PAPER, and Bright; use INK ⇄ PAPER for quick reversal.
- Turn on the 8×8 grid to monitor attribute boundaries.
- Use layers for background, foreground, and overlays. Use Transparent PAPER on upper layers when lower-layer background should remain visible.
- Use Attr Only to fine-tune ZX attribute cells without damaging bitmap structure.
- Export with Export SCR when finished.
Text overlay workflow
- Select the Text tool from the toolbox.
- Click on the canvas where you want to place text — the editor opens immediately with focus, start typing.
- Change color by clicking an INK swatch (classic) or a palette color (Next) while the editor is open.
- Use Bold or Italic from the text panel for styling. Switch Font to ZX ROM 8×8 for authentic look.
- Drag the ⠿ handle to move the editor box if it covers your work.
- Press Ctrl+Enter to close the editor.
- Click and drag the text on the canvas to reposition, or use the Layers panel to manage visibility and order.
- When satisfied, use Merge Layers to rasterize the text into pixels for final export.
Dithering workflow
- Select the Dither tool from the Paint & Color group.
- Choose a dither pattern from the Dither dropdown: Solid, Checker, Sparse, or Radial.
- Adjust the Dither len. slider to control the fade-out distance of the stroke.
- Paint over the canvas — the tool progressively blends INK and PAPER within the attribute constraints.
Next Layer 2 screen workflow
- Switch to Screen Editor and select ZX Spectrum Next Layer 2 from the mode dropdown.
- Pick Color A with left-click and Color B with right-click in the 256-color palette grid. Middle-click on the canvas picks the color under the cursor.
- Draw freely — no color clash, no attribute grid.
- Use the Brightness / Contrast / Saturation sliders under the palette for temporary preview tuning. Use Apply to layer only when you want those changes baked permanently into the active layer; otherwise use Reset.
- Use Import NXI to load an existing Next screen, or Import L2 for raw pixel data.
- When done, use Export NXI for a complete file (pixels + palette), Export NXI + NXP (compat) for split compatibility output, or Export L2 Raw / Export SL2 for raw pixel data only.
- To load in NextBASIC:
LOAD "screen.nxi" LAYER 2.
Image import and Next → Classic conversion with dithering
- In classic ZX mode, click Import Image and select a JPG/PNG file — or switch the screen mode from Next Layer 2 to Classic ZX Spectrum. A conversion dialog opens.
- The dialog shows a live preview with the source image on top and the converted ZX result below. Both update automatically as you change any setting.
- Choose the conversion method: Direct for speed and clean solid areas, or Dithering (Ordered Bayer) for photos and complex graphics where gradients matter.
- If dithering is selected, set the dither strength (70–100 % is a good starting point) and pick a matrix: Bayer 4×4 is the best general-purpose choice.
- Use the Brightness / Contrast / Saturation sliders to pre-process the source image. Increasing contrast often improves ZX conversion results by making colours more distinct.
- When the preview looks good, click Convert / Import. The conversion is applied to the canvas and can be undone.
Classic → Next conversion workflow
- Design your image in classic ZX Spectrum mode including any text layers.
- Use Convert to Next — each visible pixel is mapped to the nearest Next palette color. Text object colors are also converted automatically.
- Continue editing in Next mode with full 256-color freedom.
- Export as NXI.
Next sprite workflow (single 16×16)
- Switch to Sprite Editor, select ZX Spectrum Next 8bpp mode.
- Set size to 16×16 (default). Select palette colors and transparent index.
- Draw your sprite. Use middle-click to pick colors.
- Add frames for animation with New Frame.
- Export as Next SPR — 256 bytes per frame, load with
LOAD SPRITEor your own loader.
Next sprite workflow (large / multi-tile)
- Switch to Sprite Editor, select ZX Spectrum Next 8bpp mode.
- Set width and height to multiples of 16 (e.g. 32×32 for a 2×2 tile character). The info badge will show "2×2 = 4× 16×16 sub-sprites".
- Draw on the full canvas — the editor handles the internal tile split automatically.
- Export as Next SPR. The file contains all hardware tiles sequentially (left-to-right, top-to-bottom).
- In your Z80 code, load consecutive sprites with
LOAD SPRITE/NEXTREGcalls and position them at X, X+16, X+32, Y, Y+16, Y+32 as appropriate. - Alternatively use the ASM export which provides per-tile labels for direct inclusion in your sjasmplus or ASW source.
Classic sprite workflow
- Switch to Sprite Editor.
- Set width (multiple of 8), height, zoom, and mode (Monochrome or Color).
- Create frames with New Frame.
- Draw frames and preview them with Play.
- Use mask mode if your target routine requires explicit mask data.
- Export as BIN or ASM.
Typical font workflow
- Switch to Font Editor.
- Select Standard 32..127 or UDG A..U.
- Import an existing font, load ZX 8×8, or draw from scratch.
- Edit glyphs from the thumbnail grid one by one.
- Apply shift and rotate tools where needed.
- To use your font in the Screen Editor, go to the Text tool and select Font editor from the font dropdown.
- Export in BIN or ASM format.