Stellar Design System
A CSS implementation of the Stellar design system for spacecraft operation tools.
Toggle Light/Dark Theme
Button
Primary
Disabled
Secondary
Disabled
Tertiary
Disabled
Primary
Disabled
Secondary
Disabled
Tertiary
Disabled
Input
Textarea
User input that wraps to another line
Non-resizable textarea
Select
Cat
Dog
Parrot
Disabled
Error
Table
Column 1
Column 2
Column 3
Column 4
Cell text
Cell text
Cell text
Cell text
Cell text
Cell text
Cell text
Cell text
Cell text
Cell text
Cell text
Cell text
Badge
1
10
100
1000
Typography
Display H1
Display H2
Display H3
Display Body
Header
Label
Body
Medium
Bold
Small Caps
Color
Gray 10
CSS Variable: --st-gray-10
Gray 15
CSS Variable: --st-gray-15
Gray 20
CSS Variable: --st-gray-20
Gray 30
CSS Variable: --st-gray-30
Gray 40
CSS Variable: --st-gray-40
Gray 50
CSS Variable: --st-gray-50
Gray 60
CSS Variable: --st-gray-60
Gray 70
CSS Variable: --st-gray-70
Gray 80
CSS Variable: --st-gray-80
Gray 90
CSS Variable: --st-gray-90
Gray 100
CSS Variable: --st-gray-100
Primary 10
CSS Variable: --st-primary-10
Primary 20
CSS Variable: --st-primary-20
Primary 30
CSS Variable: --st-primary-30
Primary 40
CSS Variable: --st-primary-40
Primary 50
CSS Variable: --st-primary-50
Primary 60
CSS Variable: --st-primary-60
Primary 70
CSS Variable: --st-primary-70
Primary 80
CSS Variable: --st-primary-80
Primary 90
CSS Variable: --st-primary-90
Primary 100
CSS Variable: --st-primary-100
Icons