Turso

Turso's design evokes a sophisticated 'hacker aesthetic' — dark, precise, and highly functional code tooling. The interplay of a deep, almost black background with a singular, vibrant teal accent color (#4ff7d1) creates an electric tension. Sharp rectangular panels with subtle, near-black borders provide structure, contrasting with the occasional pill-shaped button that introduces a touch of approachable modernity. Text hierarchy is established through font weight and size variations, not color, with the vivid teal reserved for key calls to action and distinguishing elements. Prioritize Hacker Teal (#4ff7d1) for primary calls to action, headlines, and key interactive elements to draw the eye. Maintain a deep, dark aesthetic using Deep Space (#0d1318) for backgrounds and Charcoal Surface (#162129) for secondary panels. Use Cloud Gray (#ffffff) for primary text on dark backgrounds, ensuring high contrast and legibility. Apply 12px radius to most structural components like cards and panels for a consistent, subtle modern edge. Implement 9999px radius for all primary and secondary buttons, along with small badges, to create distinct interaction points. Employ the Inter font family, varying weights (400-800) to establish clear typographic hierarchy without introducing new typefaces. Use Slate Border (#283945) for all component borders to subtly define elements against the dark background without harshness. Avoid introducing additional saturated colors that would dilute the impact of Hacker Teal (#4ff7d1) and Electric Violet (#d946ef). Don't use overly rounded corners (e.g. 24px) on large content cards; reserve that for specific, small elements like nav items. Do not use shadows for elevation; rely on border colors, background tints, and spacing to define hierarchy and depth. Refrain from using light backgrounds; the entire system is built for a dark interface, and light elements would disrupt the aesthetic. Do not use generic system fonts; 'Inter' is critical to the site's modern, technical tone. Avoid dense information blocks; use generous spacing (40px padding, 8px-16px element gaps) for comfortable readability on deep backgrounds. Do not use small font sizes (below 14px for body content), as it compromises readability on the dark theme.