Design

Prompt It Yourself uses the Mate Wish Key system: one red, warm neutrals, Fraunces, Manrope and JetBrains Mono, square corners and no motion. Every value below is read live from src/styles/global.css.

Logo

P and I share a vertical; the Y is a / leaving the foot of the I at 26°, the angle of the K's leg in the Mate Wish Key mark. White on the red block, always; never rounded.

Colour

• --red the block, graphics only
• --red-deep red at body size, numbers
• --red-field buttons
• --paper the page
• --panel quiet surfaces
• --line hairlines
• --ink text
• --mute secondary text
• --green links
• --night the dark bands
• --night-2 the terminal

Type scale

• --text-sm captions, metadata
• --text-base body (Manrope)
• --text-lg h3 (Fraunces)
• --text-xl h2 (Fraunces)
• --text-2xl h1 (Fraunces)

Spacing

• --space-1
• --space-2
• --space-4
• --space-8
• --space-16

Components

Buttons

Join the waitlist A quiet one

A prompt

A terminal, explained

# every command gets a comment saying what it does
~ $ pwd

Form controls