PROJECT FILES

Saving & files

Name your project, save a checkpoint, or take your code with you.

Project name

Saved locally

File nameExport format

ZIP includes separate HTML, CSS and JS files plus an editable project JSON. HTML bundles your website into one file.

Import HTML, CSS, JavaScript or a CodeNest project JSON. Projects save in this browser; export a backup for another device.

Projects

Saved in this browser. Export a backup to keep your work portable.

Room to experiment.

Automatic checkpoints every minute while editing, and before imports, switches and restores. Last 40 versions per project.

MAKE YOURSELF AT HOME

Layout & personalize

Fine-tune how your workspace looks and feels.

Color collection

Rainbow colors in dark and light, plus pink, cacao and neutrals. The logo, favicon, syntax colors and scrollbars follow your selection.

Interface

Color themeInterface fontInterface densityInterface text size

UI design

Corner styleSurface styleButton styleSettings size

Show panel dividers

Code typography

Code fontFont size (px)Line spacing

Additional open-source fonts load online. Installed fonts and matching fallbacks keep the editor usable offline.

YOUR TYPE, YOUR SPACEconst nextIdea = "something wonderful";

Workspace details

Show line numbers

Saved layouts

Keep your panel order, visibility, split, font size, theme and preview size together.

EDITOR SETTINGS

Editor behavior

Make the essentials feel natural.

Indent width

Continue indentation on EnterSyntax highlightingHighlight the active line

Tab inserts spaces. Source code and line numbers are excluded from browser translation while the app menus remain translatable.

Panel controls

Use the orientation selector before the language buttons. Drag panel titles or use their fixed arrow buttons. The minus button minimizes a language.

LIVE CANVAS

Preview

Control when the preview updates and how it fits your workspace.

Update preview while typing

Update delayDefault viewportCanvas backdrop

Show preview title bar

Viewport widths fit inside the available preview area. Use fullscreen for more space.

YOUR KEYS, YOUR WORKFLOW

Keyboard shortcuts

Click a shortcut, then press your preferred combination. Use Ctrl/⌘ or Alt with a key. Escape cancels recording.

Common browser and editing shortcuts are protected. Ctrl and Command are interchangeable across platforms.

COMFORT & CLARITY

Accessibility

Reduce animation and motionMore visible keyboard focusStronger panel bordersShow bottom status barLarger buttons and controls

Translation-safe editors

Menus can be translated by your browser. Code, syntax colors, file names and line numbers are marked as non-translatable and keep left-to-right monospace formatting.

Keyboard navigation

Use Tab to move between controls. In the menu sidebar, use arrow keys, Home and End to switch topics. Escape closes the menu.

KEEP YOUR WORK

Backups & storage

Projects and version history live in this browser, not in your GitHub repository.

Library backups include all projects and their saved versions. Import adds copies without replacing existing projects. Theme preferences and shortcuts stay specific to this device.

Local preferences

Resets colors, fonts, UI design and accessibility options. Your projects, layouts and shortcuts stay saved.