GithubX

Styling

Pick the mono font, the color scheme and the characters every frame is drawn with. Changes apply live across the whole site and are saved in this browser.

## font

Monospace families from Google Fonts.

// now: IBM Plex Mono (bundled default)

## colors

Seven dark and seven light palettes. Pick one — it applies to every token at once.

dark:
light:

## border characters

Lines take a single character or a sequence that repeats along the edge — <|> draws <|><|><|>. Junctions (corners and intersections) are always one character.

presets:
top edge, repeats →
bottom edge, repeats →
left edge, repeats ↓
right edge, repeats ↓
inner rules, repeats →
corners, single char

Components draw the classic set with no setup. If you change it, wrap your app once in AsciiCharsProvider (in the root layout) with the characters you picked — copy the snippet from the config below.

## install

Every palette is a registry item. Scaffold a new project with it, or add it to one you already have — it ships the tokens, the type scale and the ASCII frame primitives.

Scaffold a new project:

pnpm dlx shadcn@latest init https://ascii.cnlibs.com/r/themes/phosphor.json

Or add the theme to an existing project:

pnpm dlx shadcn@latest add https://ascii.cnlibs.com/r/themes/phosphor.json

## export

Your theme is saved in this browser. The palette ships with the install command above; if you changed the characters, copy the provider into your root layout.