Status

Status

Preview image. Unlock full-res

Midnight Command Center: a dark interface on deep canvas, with precise white type and select vibrant accents.

Industrycrypto
Palette
#09101c
#1b273d
#ffffff
#dce0e5
#f0f2f5
#3a4049
#647084
#000000
#131d2f
#a1abbd
#7140fd
#2a4af5

Status employs a dark, crypto-native aesthetic, evoking a secure, high-tech environment. The primary interface is a deep, near-black canvas, contrasted by crisp white typography for prominence and readability. UI elements often feature soft, subtle borders and a deliberate avoidance of strong shadows, lending a flat, yet layered, appearance. Vivid accent colors of purple and blue are reserved for interactive elements and brand highlights, creating clear focal points against the monochromatic base. Prioritize Deep Space (#09101c) for page backgrounds and Cloud White (#ffffff) for primary text and light surface areas to maintain the high-contrast dark theme. Apply Lapis Glow (#2a4af5) specifically for primary action buttons and highlight states to ensure immediate visual recognition of interactivity. Use Inter at 88px weight 700 with a letter spacing of -0.0210em for large, impactful display headings (display role). Employ a base border radius of 20px for cards and 12px for primary buttons and interactive elements, favoring slightly rounded corners over sharp edges. Maintain a clear functional distinction between text colors: Cloud White (#ffffff) for primary text, Quiet Fog (#647084) for secondary text, and Violet Plasma (#7140fd) for critical links or highlighted information. Utilize the subtle shadow rgba(9, 16, 28, 0.08) 0px 4px 20px 0px exclusively for elevated Product Feature Cards to signal a distinct layer of content. Ensure horizontal and vertical spacing between major sections adhere to 40px, while internal component spacing uses a smaller harmonious increment from the 4px base unit. Avoid using highly saturated colors for large background areas or extensive text blocks; these are reserved for accents and interactive elements. Do not introduce heavy, complex shadows or excessive gradients for general UI elements, as the design emphasizes a flat and clean aesthetic. Do not deviate from the Inter typeface; it is the sole font for all typographic needs. Do not create buttons with hard, unrounded corners; all interactive elements should adhere to the established radius tokens. Avoid using multiple foreground colors within a single text block unless for specific, semantic highlighting such as links or status updates. Do not use dark text on dark backgrounds; ensure sufficient contrast by always pairing Cloud White (#ffffff) or similar light colors with Deep Space (#09101c) and other dark neutrals. Do not apply the main card shadow to anything other than Product Feature Card and similar elevated content panels.

More like this