A digital gallery blending classical architecture with retro-gaming aesthetics to tell modern fables.
02
Color
#000000Ink
#F6F2E4BG
rgba(0,0,0,1.0)Line
Stark high-contrast dualism: warm, parchment-like beige for the pixel-art gallery and deep black for the typographic interludes.
03
Typography
monospaced
display27px · 400
body14px · 400
All text is uppercase for headings and frequently for body labels. · Monospaced typography is used exclusively across all text levels. · Letter-spacing is generally neutral or slightly loose.
04
Spacing
4px
8px
16px
24px
32px
48px
64px
96px
Generous padding and gaps prioritize legibility and breathing room around the pixel art elements.
05
Surfaces
sm · 0px
md · 0px
lg · 0px
pill · 999px
1px solid black, used to frame the gallery sections and cards.
06
Layout
1280container
12columns
24pxgutter
768 / 1024breakpoints
A clean, grid-based layout where large hero images and text blocks are separated by thin black lines.
07
Motion & Interaction
220msmicro
400mssmall
800msmedium
cubic-bezier(0.23, 1, 0.32, 1)easing
Smooth, continuous transitions for scroll-based reveals. · Gentle opacity and transform fades.
Subtle opacity or color shifts. · Immediate response.
08
Components
buttonPill-shaped buttons with monospaced text and solid black backgrounds.
cardFramed content blocks with thin borders and rounded corners.
chipNone visible.
inputNone visible.
heroA large, immersive pixel-art illustration depicting a classical scene with modern elements.
09
Voice & Don'ts
ToneContemplative, philosophical, and narrative-driven.
HeadlinesShort, punchy, and often uppercase to command attention.
CTAsDirect and simple, using monospaced text.
Don't use smooth, rounded UI components — screenshot shows sharp, pixel-art aesthetics and thin geometric borders.
Don't use sans-serif fonts — screenshot shows monospaced fonts exclusively for all text.
Don't use a white background — screenshot shows a warm, off-white parchment color (#F6F2E4) or pure black.
Don't use a vibrant accent color — screenshot shows a strictly monochromatic palette of black and beige.
Don't use complex drop shadows — screenshot shows completely flat design with only solid borders.
Don't mix serif and sans-serif typefaces — screenshot maintains a strict monospaced typographic system.
Captured from the live site · real computed styles
11
System prompt
This website presents a premium, editorial experience centered around a pixel-art gallery that explores philosophical themes. It utilizes a stark, dualistic color palette of warm parchment (#F6F2E4) and deep black (#000000), creating a high-contrast visual language. The typography is strictly monospaced, with all text frequently presented in uppercase to match the retro-gaming, pixel-art aesthetic. Critical design constraints include avoiding any use of serif or sans-serif fonts, steering clear of vibrant accent colors, and ensuring all UI components remain flat without the use of drop shadows. The layout is structured and grid-based, providing ample whitespace to frame the detailed pixel-art illustrations.
Bring this taste to your agent
Hand your AI agent a machine-readable spec of this design — tokens, type, motion, the whole DNA.
