Glideapps

Glide's design system evokes an 'engineering clarity on a white canvas' aesthetic. It features a stark, high-contrast monochrome base, punctuated by a vibrant turquoise accent color for primary actions and interactive feedback. Typography is precise and utilitarian, prioritizing readability with minimal visual flourish. Components are lightweight with subtle radii and no prominent shadows, emphasizing a clean, fast interface designed for productivity. Prioritize high-contrast achromatic palettes for structural elements, using Ink Black (#000000) for primary text and Canvas White (#ffffff) for backgrounds. Apply Oceanic Teal (#71eaee) exclusively as an accent for primary actionable elements like 'Start for free' buttons and key interactive highlights. Use bootonFont with tighter letter-spacing (-0.02em) for larger headings (48px and above) to achieve a condensed, modern impact. Maintain minimal border-radii: 6px for buttons and general UI elements, 12px for larger cards, and 0px for inputs to reinforce a precise aesthetic. Utilize a consistent 8px elementGap to structure component relationships and a 80px sectionGap for clear content separation. Ensure all interactive elements provide visual feedback, such as the subtle rgba(255, 255, 255, 0.2) 0px -1px 0px 0px inset shadow for primary buttons. Position content within a max-width of 1200px, centered on the page, with full-width sections for imagery or background patterns. Do not introduce new chromatic colors beyond Oceanic Teal (#71eaee) without explicit brand evolution; maintain a predominantly monochrome aesthetic. Avoid heavy drop shadows or aggressive gradients; the system relies on flat surfaces, subtle borders, and minimal inset shadows for elevation. Do not deviate from the specified type scale for heading sizes or body text, as precise letter-spacing and line-heights are critical to brand legibility. Refrain from using excessively large border radii; the design opts for subtle rounding over overtly soft or pill-shaped elements. Do not use generic system fonts for headings; always default to bootonFont or affairsFont to maintain brand voice. Avoid dense, information-heavy sections without adequate sectionGap (80px), as the design emphasizes clear separation and comfortable reading zones. Do not use 0px padding for interactive components like buttons, as it negatively impacts usability; maintain at least 6px vertical and 12px horizontal padding.