By continuing you agree to our Terms and Privacy Policy
Login · Light
9:415G
Astronect
Your personal cosmos
By continuing you agree to our Terms and Privacy Policy
Register · Live — click through it
Register · Dark theme (default) · all states
Step 1 · Avatar filled
Step 1 · Validation error
Step 1 · Gender (single sheet)
Step 1 · Preferred (multi sheet)
Step 2 · Your birth chart
Step 2 · Date picker
Step 2 · Time picker
Search · Empty prompt
Search · Typing → loading
Search · Results
Search · No results
Search · Fetch error
Step 3 · Your life now
Step 3 · Relationship sheet
Step 3 · Employment sheet
Submit · Loading
Submit · Form error banner
Register · Light theme · all states
Register · Live · Light
Step 1 · Avatar filled
Step 1 · Validation error
Step 1 · Gender (single sheet)
Step 1 · Preferred (multi sheet)
Step 2 · Your birth chart
Step 2 · Date picker
Step 2 · Time picker
Search · Empty prompt
Search · Typing → loading
Search · Results
Search · No results
Search · Fetch error
Step 3 · Your life now
Step 3 · Relationship sheet
Step 3 · Employment sheet
Submit · Loading
Submit · Form error banner
Design System
Celestial · v1.0
Astronect
A refined celestial design language — deep night-sky color, elegant Cormorant display, and restrained light. Dark theme is default; light is its own palette.
Color · Dark theme (default)
{{ c.name }}
{{ c.val }}
Color · Light theme
{{ c.name }}
{{ c.val }}
Typography
{{ t.name }}
{{ t.sample }}
{{ t.meta }}
Spacing · 4px base
{{ s.label }}
{{ s.px }}
Radius
{{ r.label }}
{{ r.px }}
Elevation & glow
{{ e.name }}
Components · Social sign-in
On dark
On light
Components · Register flow
v1.1 · added this release
Each is reusable across the app. Full interactive states live in the Register flow frames to the left — these tiles pin the spec.