
Preview image. Unlock full-res
Deep space console: focused intensity.
Depot’s aesthetic is a high-contrast dark mode, evoking a command center's precision. Deep, near-black backgrounds frame content, punctuated by vivid green accents that immediately draw the eye to critical interactive elements. A subtle progression of dark grays creates layered surfaces, adding depth and structure without reliance on heavy shadows. The overall impression is one of efficiency and focused power without distraction, like a purpose-built tool designed for speed.
Use Carbon Black (#04040b) for primary page backgrounds to maintain a consistent dark theme.
Apply Canopy Green (#366740) for all primary call-to-action button backgrounds, paired with Terminal Green (#71d083) text.
Implement 6px border radius as the default for most interface elements, with 10px used for key interactive elements like primary buttons.
Ensure Red Hat Text Variable with 0.0250em letter-spacing is used for all body text and secondary UI elements for optimal legibility.
Maintain a clear visual hierarchy using Red Hat Display Variable for headlines, particularly with its tight -0.0250em letter-spacing to distinguish it from body copy.
Utilize Ash Gray (#323035) for button backgrounds and secondary content blocks to create subtle elevation on dark surfaces.
Avoid using bright, high-saturation colors for large background areas; colors like Terminal Green (#71d083) are strictly for accents and interactive elements.
Do not deviate from the specified letter-spacing values across Red Hat Display Variable and Red Hat Text Variable as they are integral to the system's character.
Avoid excessive use of shadows; the system relies on layer colors (Night Sky, Ash Gray) and subtle inset shadows for depth.
Do not introduce new typefaces; Red Hat Display, Red Hat Text, and Red Hat Mono are the only approved families.
Refrain from using color in body text that does not meet the specified Snow Drift (#eeeef0) or Cloud Burst (#b5b2bc) for readability against dark backgrounds.
Do not use generic square or fully rounded (pill) shapes; adhere to the 6px and 10px radii for a consistent, structured appearance.









