//Admin Dashboard
{{ buildLabel }} unsaved
{{ status }}
sandbox The real dashboard, running in your browser. Nothing is sent to a server — which also means clearing your browsing data, or using a private window, loses this site. Download your content.json to keep it.
Nice — this is starting to look like a site. It lives in this browser only, so grab your content.json to be safe.
MeridianOS · sandbox

This starter site is yours.

You're looking at the real MeridianOS dashboard. Rename things, drag icons, swap the theme — then hit Preview OS ↗ to see exactly what a visitor would see.

Nothing is sent anywhere. Your edits save in this browser, so you can close the tab and come back.

When you like it, Take it with you ↓ hands over the files and you host them wherever you want. Free, no account.

Welcome back.

You were building a site here. Pick up where you left off, or start over with a fresh starter site?

take it with you

Three steps to a live site.

All free, all static files. No account, no lock-in.

1
Download your site's content

content.json holds everything you just built — every window, icon, colour and word.

2
Get the OS itself

The pages that read your content.json — both themes, the dashboard, the manual. Free. Leave your email and I'll send the files, plus a note when new themes and updates land.

3
Drop your content.json in, and upload

Put your file beside index.html, replacing the one there, then upload the folder to Neocities (free) or any host. That's a live site. From then on you run the dashboard from your own folder and it does the rest.

No content loaded. If you opened this file directly (file://), the browser blocks auto‑loading content.json — click Load to pick it manually.
{{ draftMismatchMsg }}
Loaded the content.json this address is serving. An older editor copy of {{ stashedName }} had no unsaved changes, so it was set aside — nothing was deleted.
The linked folder {{ linkedDirName }} holds a different content.json than the one this address is serving — either another site, or an older copy of this one. Export writes to that folder, not the site you are looking at.
{{ s.typeLabel }}

{{ s.label }}

{{ s.hint }}

accentfill
Uploads are saved as a real file in images/icons/ and added to your icon library (Tools) — no content.json bloat. Needs Chrome/Edge folder access.
The content below is encrypted (AES‑256) with this password on export — visitors must enter it to view. Keep it safe: it can't be recovered, only reset by re‑entering here.
Adds one image block per file in that folder (sorted by number in the filename) — perfect for multi-page document scans. Files already in the post are skipped, existing blocks untouched. Needs a directory-listing server (run via a launcher / localhost), same as gallery scan.
{{ bl.typeLabel }}
The value inside data-customgform="…". The form renders inside the post on the OS. Set it to 100% width in customgform.
preview
Width{{ bl.widthLabel }}
Link to a hosted image — don’t embed it (keeps content.json small).
▸ YouTube / Vimeo link — embeds on the site.
Link to a hosted video — don’t embed it.
A section link opens that window inside the OS. Instead of https://…, the URL field above also takes section:<id> or goto:/folder/name (the Go to Folder path). In Text blocks, use [label](goto:/folder/name).
preview
If nothing shows above, the path is wrong or the file isn’t on your server yet.
The value inside data-customgform="…". Set the form to 100% width in customgform so it fits the window.

Many sites (most shops, Google, social apps) block opening inside a window — those show an “open in new tab” button. Sites you control usually work in a window.

Loads the URL above in a real window preview.
{{ embedTestSrc }}open in new tab ↗
blank = blockedIf you only see this striped pattern, the site refuses to embed (X‑Frame‑Options / frame‑ancestors). Use “a new browser tab” above instead.
{{ embedTestFrame }}

Only reliable when you run the editor locally — the in‑browser preview here may block all external sites regardless.

▸ YouTube / Vimeo link detected — it embeds and plays on the site.
Link to a hosted video — don’t embed the file (keeps content.json small).
Point each track at a file in your /music or /audio folder (e.g. music/song.mp3) — or a full URL. Files already in /music don’t need re-uploading.
Files live in your site’s audio/ folder by default (or paste any full URL). Upload the actual audio file to that folder on the server — the editor only stores the path.
The path/URL only shows when the source is a linked file (not pasted code). Turn both off to hide the toolbar strip above the page entirely.
{{ s.htmlPreviewEl }}
🔒 This folder is locked
Its contents were encrypted on this device or another machine. Enter the password to unlock it for editing — its items and password will reappear.
Everything in this folder is encrypted (AES-256) with this password when you export. Visitors must enter it to open the folder. Keep it safe: it cannot be recovered, only reset here.
Both show on the locked window in the OS — the message replaces the default line above the password box, the hint appears in grey below it. Leave blank for the defaults.
Fills this folder’s window body (and its lock screen).
Shown above the password box on the locked window.
{{ ch.label }}
Add any gallery, swatch, post, or another folder (folders can nest as deep as you like). Create the item first via “+ Add section” (uncheck “Show on desktop”), then add it here. Folders open in place; image/video posts open in the viewer.
images/gallery/ images/swatches/
{{ s.scanHint }}
Runs offline on your computer (Chrome/Edge). Reads {{ s.genBaseLabel }}big/ and writes thumbnails/ (~480px) + blurthumbnails/ (~28px). GIFs skipped; originals never touched.
quality {{ s.reencQ }}% Shrinks any thumbnail over 100 kB to this quality (75% looks identical in a grid). PNG/GIF left alone.
{{ s.genStatus }}
Drag the ⠇⠇ handle (or tiles) to reorder · ◉ eyeball hides an image (dims in place) · label shows under the image in the OS, caption shows in the lightbox.
thumbnail sizeadmin preview only — doesn't change the OS
missing {{ m }}
thumbnail sizeadmin preview only — doesn't change the OS
{{ mm }}
GIF {{ r.fileName }}

Map

{{ r.lockBadge }} {{ r.pathHint }} {{ r.typeLabel }} {{ r.count }}
◉ hide {{ keyIconGlyph }} choose icon 🎨 accent color ⏻ open on startup ◱ open-with-folder ☰ View menu ⚸ hidden = off the desktop & menus but still reachable via Go To Folder search — click the row’s hidden tag label again (⊘) to make it completely unreachable, not searchable

◆ Diamond menu

Toggle items in the top-left ◆ menu.

Display
Accessories
Apps

Trash

Empty — deleted sections land here.

{{ tr.label }}{{ tr.typeLabel }}

Page metadata · SEO & sharing

!  These fields are baked into your site's HTML only when you ⤓ Export site — after editing here, export and re-upload index.html (and vintageos.html) for search engines and link previews to see the changes.
social preview
favicon preview
The gtag snippet is injected into both pages' <head> when you Export site.

Interface sounds

Short synthesised sounds — the flash from the boot screen to the desktop, and clicks when a window opens, closes or minimises. Click any option to hear it.

Browsers keep audio muted until a visitor's first click, so on a cold page load this is usually silent — it plays on a restart, a theme switch, or any boot after they have interacted.

MeridianOS webring

A webring links MeridianOS sites in a circle — visitors hop between member sites via a small bar at the bottom of the desktop. On phones it shows as a bottom bar, or a slim side strip when the dock is on.

1.  Put your site online, then sign up here →
2.  Wait for approval — a human adds your site to the ring.
3.  Switch the bar on below. It finds your spot in the ring automatically once your site is live.
{{ ring.checkMsg }}

OS views

Your site ships as two themes — Platinum and Vintage. Choose which one visitors land on and what the other file is called; the ◆ menu switches between them.

On Export site, your default theme is written to index.html and the other theme to this file. The ◆ “Switch view” item jumps between the two.

Appearance Platinum only

Recolor the menu bar and the desktop selection highlight. Pick a curated theme, or fine-tune the three colors below. Affects the Platinum view only — Vintage keeps its classic black & white.

Custom cursor

Replace the mouse pointer across the OS with a retro cursor — a matching hand shows on clickable things (icons, links, buttons). Off by default (normal system cursor). Applies to both Platinum & Vintage. Upload your own in Tools → Cursor builder.

Custom cursor set. Upload / adjust it in Tools → Cursor builder.
No custom cursor yet — upload one in Tools → Cursor builder.
Bigger cursors (48–64px) look bold, but a few browsers cap the pointer at 32px.

Cursor trail

Little glyphs that follow the mouse — falling pieces, sparkles, or a classic follower chain. Very old-web. Desktop only; off by default. Applies to both Platinum & Vintage.

Try ◆ ✦ ✿ ♥ · falling ◆ is very on-brand.

Boot screen

Welcome window

The readme shown on the desktop at startup.

About OS window

Enjoying MeridianOS? Support development (and other things I make): patreon.com/nathanmakesstuff
Removing the credit is free, always. If MeridianOS earned a spot on your site, consider supporting the project — it’s what keeps it alive: patreon.com/nathanmakesstuff

Startup

Which windows pop open when the site boots — the top of the list opens first; drag to reorder. Only items switched on appear here — add sections with the picker below, or switch on music / games / the calendar from their own tabs. Set an exact X·Y (px) or drag a window in the preview below.

Welcome window
Desktop · x · yMobile
{{ su.label }}

Startup preview

Drag a window to set where it opens; drag its corner to resize. The preview follows your browser size.

{{ win.label }}
{{ win.sizeLabel }}

Desktop background

Link to a hosted image — don’t embed it (keeps content.json small). Shown cover-fit behind the desktop.
color

Desktop icons

icons on the
icon size
folder icon size
{{ dt.glyphEl }}{{ dt.label }}
⟨ prevnext ⟩

Drag icons above (or rows below) to arrange the desktop — independent of mobile.

{{ d.label }}

Mobile — home grid & dock

Mobile layout is independent of the desktop. Drag rows (or icons in the phone) to arrange; “dock” pins an item to the bottom bar (max 4). Drag the welcome band to place the welcome window — or tick “opens below icons” below to place it automatically.

{{ m.label }}
{{ mt.glyphEl }}
{{ mt.label }}
{{ dt.glyphEl }}
⟨ prevnext ⟩
{{ welcomeWinTitle }}
welcome
mobile icon size
dock opacity
dock colour
webring on phones side strip on the — side strip when the dock is on; bottom-center without one

Extra desktop icons

Link icons on the desktop — e.g. instagram or contact. Each gets its own icon, colour, and placement.

Screen saver

idle minutes
JavaScript, run every frame on the screensaver canvas. In scope: ctx (2d context), w/h (pixel size), t (seconds since start), state (empty object that persists between frames — stash particles etc. in it). Errors show on the canvas instead of crashing. Preview above updates live.
Link to a hosted image — don’t embed it (keeps content.json small).

Calendar

fill
selected day + the ◆ event markers on the month grid
— set where its window opens on the Startup tab
just the ID from your customgform embed code — <div data-customgform="ID"></div>

Upcoming events

{{ u.meta }}
{{ u.title }}

No upcoming events — click a day in the month grid below and hit “+ Add event”.

{{ calPrev.monthLabel }}

{{ w.d }}
{{ cell.day }}
iconicon accent

Accessories

Paint, TextEdit and Documents — the built‑in apps your visitors can use. Rename each, choose its icon, and pick where it appears (desktop icon, View menu, File menu). To show or hide them in the top‑left ◆ menu, use the ◆ Diamond menu card on the Map tab.

▨ Paint

A MacPaint‑style drawing app. Visitors draw, then save to Documents or download a PNG.

colorfill

▤ TextEdit

A simple writing pad. Visitors type a note, then save it to Documents, download a .txt, or email it.

colorfill

▢ Documents

The private drawer where each visitor’s saved Paint images and TextEdit notes are kept (stored in their own browser).

colorfill

Music player

Add songs by pasting an audio URL or scanning your music/ folder. Rename, reorder, preview, hide, or remove below.

colorfill
— set where its window opens on the Startup tab
— if the browser blocks sound before a first tap, playback starts at the visitor’s first click
— the music window and its desktop icon are unaffected

Or drop audio files (mp3, ogg, wav, m4a…) into the music/ folder in your site, then hit Scan — every track is added automatically. To remove one, just delete its file from the folder and Scan again.

music/
{{ m.pattern }} in folder

Games app

The ◈ Games launcher — its desktop icon, name, window title and where it appears.

colorfill
— set where its window opens on the Startup tab

Game menu order

Drag the ⠿ grip to set the order games appear in the OS ◈ Games menu — built‑in games, DOS & consoles together — and toggle each on desktop / mobile. New games appear automatically.

Snake and the photo puzzles run right here. DOOM, DOS games and the console emulators need game files that come with the download — switch them on once your site is on your own computer.
DesktopMobile
{{ go.label }}{{ go.tag }}

Games — puzzle images

Photos offered in the slide‑puzzle. Browse to embed images (show instantly, never break), or add a filename / full URL for a photo you already host.

embeds into content.json and bloats it — prefer the ⊞ button on gallery / swatch images
{{ p.name }}

Custom DOS games

Add more MS‑DOS games that run in the built‑in DOS player (just like DOOM). Host a js‑dos .jsdos bundle in your site and point to it by filename or URL.

A .jsdos bundle packages the game files + DOSBox config. Build one at js‑dos.com (or use an existing bundle), drop it in your site folder, and reference its path here. Saves persist in the browser, like DOOM. Controls depend on the game.

Console games (NES · Game Boy · Game Gear · Flash)

Add cartridge/Flash games that run in the built‑in emulator. Drop ROMs into per‑system folders — games/nes/, games/gb/, games/gbc/, games/gg/, games/flash/ — then hit Scan games folders to auto‑add them (like the music scan). Or add one by hand with any path. You must own the games. Saves persist in the browser; on phones an on‑screen gamepad appears.

drop ROMs in games/<system>/
Powered by EmulatorJS (NES / Game Boy / Game Gear) and Ruffle (Flash), loaded on demand. Game Boy Color uses the Game Boy core. Keyboard: arrows + Z/X/A/S, Enter/Shift — remappable in the emulator's own menu. Requires an internet connection to load the emulator engine.
comes with the download

DOOM, DOS games and console emulators

These run from game files that ship with MeridianOS — they can't run in this sandbox. Grab the files and they're yours: add your own .jsdos bundles, NES / Game Boy / Game Gear ROMs and Flash games.

Content audit

Check content.json for bloat and broken links — its total size, the biggest items inside it, any images embedded as base64 (which balloon the file), and whether each referenced file actually loads (gallery main images, audio, ROMs, icons, favicon/share image). Run it from your live site root (localhost or server) so the paths resolve — opened anywhere else, everything will look missing.

{{ auditStatus }}
content.json size: {{ audit.sizeKb }} kB
Large — consider moving embedded images to real files.
{{ b.k }} — {{ b.kb }} kB
{{ audit.b64count }} embedded base64 image(s) · {{ audit.b64kb }} kB
These live inside content.json. Move them to real files (Icon builder / Image gallery builder) to shrink it.
{{ i.where }} — {{ i.kb }} kB
{{ audit.missingCount }} of {{ audit.total }} referenced file(s) didn’t load
Each was requested at the URL shown (relative to this admin page). If a file is really there, check that the admin is opened from your site root and that the path + spelling match exactly.
{{ m.p }} [{{ m.status }}]
{{ m.url }}
✓ No embedded base64 and no missing files — checked {{ audit.checked }} path(s).

Image gallery builder

Batch-shrink a folder of full-size photos into a gallery-ready set — big images plus matching thumbnails and blur-ups — in one pass. Runs on your computer; originals are never touched.

or px
Images are scaled so the longer side is {{ webSize }}px (portrait or landscape). Smaller images are left as-is — never upscaled.
82% is a good balance of sharpness and file size.
Pick the folder of full-size images when asked. A new web-{{ webSize }}/ folder is written inside it with big/, thumbnails/ and blurthumbnails/ subfolders — drop it into images/gallery/<name>/ and Scan. (Uncheck the box above for a flat resize only.) Spaces become “_” unless turned off; originals stay put. Chrome/Edge.
{{ webStatus }}

Icon builder

Turn any image into a crisp square icon for a folder, app or the desktop. Auto-crops to square at 128×128 — pick a shape and optional background, then save straight into images/icons/ (a real file, so it never bloats content.json).

128px file
on the desktop
100% fills the square edge-to-edge. Below 100% shrinks the image inside it (turn on a background fill, or keep it transparent); above 100% zooms in and crops.
images/icons/{{ iconExt }}
✓ {{ iconSavedPath }} — paste this into any section's icon field (or upload it).

Saved icons appear in every icon picker (sections, apps, calendar) next to the built-ins. The eye hides one from the pickers without deleting it; ✕ removes it (any item using it reverts to a folder icon). GIFs are saved as-is and animate at icon size — shape & background apply to still images only.

{{ li.label }}

Cursor builder

Give the OS a custom mouse cursor. Pick a built-in pixel cursor or upload your own image — you get a pointer plus a matching hand for clickable things. It’s off by default; turn it on here or in System settings → OS views. Applies to both Platinum & Vintage views.

{{ p.name }}
Applies to the built-in and your uploaded cursor. 48–64px look bold; a few browsers cap the pointer at 32px.

PNG with a transparent background works best. Auto-shrunk to fit 32×32 (the browser’s max cursor size). The hotspot is the exact click point in pixels (0,0 = top-left corner). Uploading switches the cursor to “Custom”.

Pointer · main arrow
Clickable hand · optional
Current: {{ cursor.modeLabel }}

ASCII banner

Make a monospace banner for the top of the welcome window — from a word or from an image (e.g. a logo). Tune the width, then send it straight into the welcome window.

Font
Real ASCII-art fonts — bundled with the exported site (vendor/figlet), so the tool works offline.
{{ asciiImgName }}
generating…
preview — shown exactly as it will look at the top of the welcome window
{{ asciiOut }}
✓ the welcome window has a banner

Favicon & share image

Make a browser-tab favicon and a social-share (Open Graph) image from one source picture, save them to your site, and wire them into your page metadata automatically.

favicon
share image (1200×630)
Writes favicon.png to your site root and images/og.jpg, and sets them in your page metadata. Chrome/Edge.

How this editor works

This dashboard edits content.json — the single file that drives everything on your site: every folder, window, gallery, text post, desktop icon, the boot screen, music, games and screensaver. Both index.html and vintageos.html read this file at load, so one content.json powers whichever OS theme you ship.

It runs entirely offline on your own computer — nothing you type leaves your machine until you publish.

Your edits auto-save as a draft in this browser as you go, and the OS Preview reads that draft, so you can check changes before publishing.

Three ways to save: Export site (top bar) writes index.html, vintageos.html + content.json into your site folder and drops a timestamped copy of each into a backups/ folder. Save content.json overwrites the content.json you’ve linked (pick it once; later saves overwrite it silently). Download content.json saves a fresh copy wherever you choose.

New here? Start in the Map — it shows your whole site as a tree you can drag, rename, nest, hide and delete.

Files you deploy

Everything your live site needs — upload these to your web host (or let Export site write them for you).

index.html — the Platinum OS theme (your main page)
vintageos.html — the Vintage Mac theme (optional alternate view)
content.json — all your content & settings
support.js — the runtime both pages load
/images — galleries, swatches, icons, favicon
/music — tracks for the music player
/audio — audio-post files (if not embedded / not a URL)
/games — DOS .jsdos bundles + console ROMs in /games/nes, /gb, /gbc, /gg (and /roms) + Flash .swf
Game pages live inside /games (only if you keep games on) — games/doom.html, games/dosgame.html, games/emulator.html, games/flash.html, games/doom.jsdos + games/emulatorjs
/backups — timestamped copies Export site keeps (not needed live)

index.html and vintageos.html only change when you ship a new build of the theme — day to day you’re only re-uploading content.json and any new images.

Section types — what to use

Image Gallery — a grid of photos. Add by filename (e.g. 22.jpg) or full URL; supports separate thumbnail + full‑size versions (add by number and it builds both paths).

Swatch Set — one image per swatch plus a 3‑colour palette you set (auto‑extracted when you scan a folder).

Single Image File — one image that opens straight into the lightbox (no window). Good for a one‑off photo.

Video File — a single video (upload or YouTube / Vimeo) that opens in its own window.

Audio File — one or more tracks that play in the desktop music app and the top‑bar mini player.

Blog Post — rich content blocks: heading, text (Markdown), image, audio, video, link, divider.

HTML File — embed your own HTML, either pasted code or a linked page, shown in a window.

Calendar — a calendar window with an optional subscribe link.

Newsletter — a signup window (paste your provider’s embed id).

Link — a desktop icon that opens a URL (yours or external) instead of a window.

Folder — holds other sections as sub‑items; nests as deep as you like, navigated in place with a back button + breadcrumb.

Password‑Protected Folder — a folder whose contents are encrypted and only open after the visitor enters the password you set.

Organizing with the Map

The Map is your file explorer — the whole site as a draggable tree.

Reorder & nest — drag a row by its ☰ grip. Drop near a row’s top/bottom edge to place it before/after; drop onto the middle of a folder to move it inside. Folders collapse / expand with the ▾ chevron.

Per-row controls — each row has an eyeball (hide / show), an icon button + accent colour, the editable name, and quick toggles: ⏻ open on startup, ◱ open with its folder, ☰ show in the View menu.

Click a name to edit that section. The ✕ on a row sends it to the Trash.

Reordering in the Map does not move your desktop icons or change startup stacking — those have their own order (the Startup & Desktop tab).

Hidden sections & “Go to Folder”

Hiding a section (eyeball in the Map) removes it from the desktop, the View menu and folder listings. Hiding a folder hides everything inside it.

A hidden section is still reachable on the site via ◆ menu → Go to Folder — but only if the visitor knows its exact folder path, typed with a leading slash, e.g. /sketches/quilt. Typing just the name does nothing. This makes hidden sections act like secret/unlisted pages.

The Map shows a label under each hidden row with its path. Click that label to switch it to completely unreachable (⊘ — not even findable via Go to Folder).

Trash — nothing is lost

Deleting a section anywhere (the Map ✕ or a section’s Delete button) moves it to the Trash at the bottom of the Map — it’s not gone.

Restore brings it back (hidden from the desktop, so you decide where it goes). Purge / Empty Trash deletes permanently — that can’t be undone.

Deleting a folder pops its contents back out to the top level so they’re never orphaned.

System settings

The System settings tab is where the site presents itself — its metadata, which theme loads, and the boot / welcome / about screens.

Page metadata · SEO & sharing — the browser-tab title, the description search engines show, and the social-share (Open Graph) image + title used when your link is posted. You can also paste a full analytics snippet (Plausible, Fathom, Matomo, GA…). All of this is baked into index.html / vintageos.html when you Export.

OS views — your site ships as two themes, Platinum and Vintage. Pick which one visitors land on (it becomes index.html on export), name the other theme’s file, and toggle whether the ◆ menu offers a “Switch view” item.

Boot screen — the retro BIOS start-up sequence. Edit the intro lines, scan lines and final line, or tick “Skip the boot screen” to drop straight to the desktop.

Welcome window — the readme that opens on the desktop at startup: its title bar, body text and tips (with separate mobile copy) and an optional ASCII banner across the top (made in the Tools tab).

About OS window — the “About this computer” panel: its title, version line, body and footer.

Startup & window placement

The Startup & Desktop tab controls what opens when the site boots, and where.

Open on startup — tick a section to have its window open automatically (separate checkboxes for desktop and mobile).

Drag-to-place preview — a mini version of your screen. Drag a window to set where it opens; positions save as a % of the screen, so they land the same on any monitor. Drag a window’s bottom-right corner to set its default open size (width × height).

Stacking order — the ▲▼ arrows reorder the list; the bottom of the list opens on top. 🎲 scatters everything to random spots.

You can also type an exact width / height (% of screen) in a section’s editor — a set size applies every time that window opens, not just on startup. (Dragging a window’s corner in the OS still wins for that session.)

Desktop icons & mobile

Desktop icons (same Startup & Desktop tab) — a live preview of your icon column. Drag icons to reorder, pick which edge they sit on (left / right), set the icon size, and toggle each item’s visibility with its eyeball.

Mobile — phones get a home-screen grid plus a bottom dock. The phone preview lets you drag icons between the grid and the dock (max 4 in the dock).

Background & screensaver live in the Startup & Desktop tab — pick a background swatch and a screensaver mode (idle-triggered on the site).

Built‑in Calendar

Meridian has one standalone calendar app (its own Calendar tab up top) — separate from the Calendar section type. Turn it on in the ◆ menu (Diamond menu → Calendar) and it appears as its own window & desktop icon.

Events — add events with a date, optional time, title, body and icon; hide any event without deleting it.

Views — show a month grid, an upcoming-events list, or both, and pick which opens by default. There’s also an optional full-screen view.

Subscribe — optionally add a subscribe link so visitors can add your calendar to their own.

Label, window title, icon and accent colour are all set in the Calendar tab.

Music

The Music tab builds the desktop music player — a playlist that plays in its own window and the top-bar mini player.

Adding tracks — paste an audio URL (mp3 / m4a / ogg…), or drop files into your site’s /music folder and hit Scan music folder to pull them in.

Managing the playlist — rename any track, drag the ⠿ grip to reorder, preview it, hide it without deleting, or remove it.

Naming & placement — set the app’s name (its desktop icon & menu label), the player window’s title, its icon & accent colour, and whether it shows on the desktop / in the menus.

Keep it lean — hosting audio and pasting the URL keeps content.json small; embedded/uploaded audio bloats it fast.

Games

The Games tab controls the ◈ Games launcher and everything inside it — built-in games plus any DOS and console games you add.

Games app — name the launcher, set its window title and icon, and choose where its desktop icon appears.

Built-in games — Snake, a photo puzzle (jigsaw / tile-weaver / glitch-reveal, which use your chosen puzzle images) and DOOM.

Puzzle images — pick the photos offered in the slide puzzle. Browse to embed images (they show instantly and never break) or add by filename.

Custom DOS games — add more MS-DOS games that run in the built-in player like DOOM: host a js-dos .jsdos bundle in /games and point to it by filename or URL.

Console games — NES, Game Boy / Color, Game Gear and Flash. Drop ROMs into per-system folders (/games/nes, /gb, /gbc, /gg) plus Flash .swf files.

Menu order — drag the ⠿ grip to set the order games appear in the ◈ menu, and toggle each on desktop / mobile.

Publishing your changes

Two ways to take a draft live.

Export site (top bar) — the fastest path. The first time it asks you to pick your site folder once; after that it writes index.html, vintageos.html and content.json straight back into it (baking your SEO / analytics settings into the two HTML files) and saves timestamped copies to backups/. Just refresh the live site.

Save content.json overwrites the content.json you’ve linked; Download content.json saves a fresh copy wherever you choose. Upload it to the root of your site (next to index.html / vintageos.html) along with any new images — changes go live on refresh.

Big audio / video bloats content.json — prefer hosting those files and pasting their URL rather than uploading them into the editor.

Where files go

Put media in your site’s images/ folder, then reference it here by filename. Paths are relative to your site root.

Gallery image → images/gallery/<name>.jpg
Icon → images/icons/<name>.png (or .gif)

Thumbnails are automatic. If a gallery folder also contains thumbnails/ and blurthumbnails/ subfolders (matching filenames), the site loads the tiny blurred image first, then swaps in the full one as it arrives — you never reference those two folders directly. The Image gallery builder (Tools tab) creates all three sizes from a folder of full‑size photos in one pass.

Audio / video / icons can be uploaded (they embed into content.json) or hosted and referenced by URL — prefer hosting big media to keep content.json small.

Built‑in tools

The Tools tab bundles helpers so you rarely need other software.

Image gallery builder — point it at a folder of full‑size photos and it batch‑creates a web‑ready set: resized big/ images plus matching thumbnails/ and blurthumbnails/, in one pass. Drop the result into images/ and Scan. Originals are never touched.

Content audit — checks content.json for its size, the biggest items inside it, any images embedded as base64 (which bloat it), and whether every referenced file actually loads. Run it from your live site root.

Icon builder — crops any image to a crisp 128×128 square icon (pick a shape + optional background) and saves it into images/icons/.

Cursor builder — gives the OS a custom mouse cursor: choose a built-in pixel cursor (arrow + a hand for clickable things) or upload your own image. It’s off by default (the normal system cursor) — turn it on here or in System settings → OS views. Applies to both Platinum & Vintage.

ASCII banner — makes a monospace banner for the top of the welcome window, from a word (real ASCII‑art fonts) or from an image, with width + size controls. “Use in welcome window” drops it straight in.

Favicon & share image — makes a browser‑tab favicon and a social‑share image from one picture and wires them into your page metadata.

Custom icons

Every section & desktop icon can use a built‑in style or your own image.

Format — PNG (transparent background recommended); SVG or JPG also work. Animated GIFs work too and keep animating at icon size — great for a spinning logo or blinking cursor.

Size — square, ~64×64px (it renders ~44px on the desktop; 128×128 keeps it crisp). Keep the file small.

Location — the quickest way is to upload an image right in a section’s icon picker; it embeds into content.json. To keep content.json lean instead, put the file in images/icons/ (or host it anywhere) and paste its path / URL into the section’s “icon URL or filename” field. The Icon builder (Tools) turns any image into a crisp square icon file for exactly this — it saves a file; it doesn’t take a URL or scan folders itself.

Raw JSON

Power‑user escape hatch. Edit and Apply, or copy the current content.

{{ rawErr }}
MeridianOS template created by nathan brookes. www.nathan.dog