Shelby

Shelby presents as a bold, almost playful take on enterprise software, fusing a deep, rich cacao-brown with a vibrant, energetic hot pink. This highly chromatic palette creates a high-contrast experience, where text and key elements pop dramatically. The use of custom, strong sans-serif typography paired with a monospaced font reinforces a technical yet approachable identity, while sharp corners are softened by occasional, deliberate slight rounding, hinting at precision within expressiveness. Use Shelby Hibiscus Pink (#FF77C9) exclusively for primary interactive elements and key brand accents to maximize impact. Maintain high contrast between text and backgrounds, pairing Shelby Cacao (#322312) with Shelby Rose Dust (#FFDFEF) or Shelby Hibiscus Pink (#FF77C9). Apply GT-Planar for all headings and substantial body text to leverage its distinctive weight variations and letter spacing. Employ the 3.95833px border-radius for buttons and badges, reserving the larger 9.89583px for cards to differentiate components. Ensure horizontal padding consistency with elementGap: 15px for most UI elements and cardPadding: 15px for internal card content. Transition color, background-color, and filter over 0.3s with ease timing for all interactive state changes. Do not introduce new saturated colors outside of the defined brand and neutral palette to avoid visual clutter. Do not use generic system fonts; stick to GT-Planar, SuisseIntl, and ABCReproMono for all typography to maintain brand identity. Avoid using drop shadows for elevation; rely instead on background color changes to denote hierarchy and depth. Do not use letter-spacing values other than -0.0400em or -0.0200em for GT-Planar, and normal for other fonts. Do not vary border radii arbitrarily; adhere strictly to 3.95833px for small components and 9.89583px for cards. Do not use solid borders unless explicitly defined in a component variant (e.g., 1px bottom border for ghost buttons).