ESTÉTICA
RELÓGIO
DESIGN SYSTEM
24+
Components∞
PossibilitiesTypography
Primary: Inter (Sans-serif)
Weights: 300, 400,
500, 600, 700, 800
Secondary/Data: JetBrains Mono
Weights: 400,
700
Strategy: Local fallback, CDN prioritized. Tight letter-spacing for display, relaxed for body text.
Heading 1
Heading 2
Heading 3: Sub-section title
Heading 4: Component title
Heading 5: Card title
Heading 6: Label
Body Large: This design system bridges the gap between chaotic creative coding and structured enterprise interfaces. It emphasizes negative space.
Body Regular: By prioritizing stark contrasts and unexpected reveals, we maintain user intrigue while delivering necessary functional elements.
Body Small: Use for secondary descriptors and minor visual notes.
SYSTEM.LOG: Value initialized.
Component status: Interactive
AA Contrast Verified
Color System
A monochrome foundation with high-contrast acid green accents. Tailored for bright, airy interfaces with 'mix-blend' capabilities.
Base / Background
HEX: #EAEAE5
Role: primary-bg
Ink / Primary Text
HEX: #1C1C1C
Role: primary-text
Surface / Cards
HEX: #F4F4F0
Role: secondary-bg
Acid / Accent
HEX: #CCFF00
Role: highlight / glow
Feedback
Error / Success / Warn
Opacity variants used
UI Components
Animated, responsive, scalable.
Buttons & Actions
Inputs & Badges
Interactive Cards
Hover Effects
A radial gradient matches cursor position to create an exploratory illumination effect.
Metrics Tracking
Dark mode component variant demonstrating visual hierarchy inversion.
Nova System
Dialog Modal
Authenticate Action
Proceeding requires system verification. This modal showcases the glass input fields alongside bold typography and dual button structures.
Iconography
Utilizing Solar Icons suite. Focused on 'bold-duotone' and 'line-duotone' for sharp, modern appearances.