Neon

Neon, dark-mode, developer

Preview image. Unlock full-res

Server Room After Dark. A deep black environment where data and interactions are the only sources of light.

Palette
#34d59a
#285d49
#39a57d
#ff3621
#ffffff
#797d86
#94979
#c9cbcf
#303236
#242628
#151617
#0a0a0b

The design feels like a high-end server room after dark — a pure black void where information glows. A strict monochrome palette of pure black (#000000) and white (#ffffff) creates maximum contrast, ensuring text and UI are starkly legible. All visual energy comes from a single, electric green (#34d59a) that mimics terminal output and data visualizations, used exclusively for accents and decorative, code-like background graphics. The system achieves depth not with shadows but with subtle, layered near-black surfaces. A unique tension exists between the pill-shaped buttons and the sharp, 4px corners of all other UI containers. Use pure Blackout (#000000) for all main section backgrounds. Reserve Neon Glow (#34d59a) for interactive highlights, data visualizations, and small decorative accents only. Employ the Whiteout (#ffffff) pill button for all primary calls-to-action. Use GeistMono for all code snippets, terminal simulations, and compact UI labels. Apply tight negative letter-spacing (-1.2px or more) to all headlines 48px and larger. Achieve depth by layering near-black surfaces (e.g., #151617 on #000000), not with box-shadows. Maintain a strict dichotomy of shapes: 9999px radius for buttons, 4px for all other containers. Don't use gradients or background colors on main page sections. Don't use traditional box-shadows for elevation. Don't use Neon Glow (#34d59a) for body copy or headlines. Don't use saturated colors other than the primary brand green and the occasional red alert accent. Don't mix Inter and GeistMono within the same sentence or headline. Don't use rounded corners larger than 4px on cards, code blocks, or input fields. Don't create buttons that aren't pill-shaped.

More like this