Our Design System
Check out our design system. 🪂
DotStyle uses purely Tailwind CSS for all its UI. Our icons are from Heroicons, LucidReact and FontAwesome.
1. Typography
HeadingsTitlesHeading InfoSub-Heading 1Sub-Headings 2SmallBodyMuted
2. Card
1. Popup Card
The Moon's surface is covered with craters, mountains, and flat plains called 'maria', which are basaltic rock from ancient volcanic eruptions.
The Moon's surface is covered with craters, mountains, and flat plains called 'maria', which are basaltic rock from ancient volcanic eruptions.
2. Wrapper Card
The Moon's surface is covered with craters, mountains, and flat plains called 'maria', which are basaltic rock from ancient volcanic eruptions.
The Moon's surface is covered with craters, mountains, and flat plains called 'maria', which are basaltic rock from ancient volcanic eruptions.
3. Utility Card
The Moon's surface is covered with craters, mountains, and flat plains called 'maria', which are basaltic rock from ancient volcanic eruptions.
The Moon's surface is covered with craters, mountains, and flat plains called 'maria', which are basaltic rock from ancient volcanic eruptions.
3. Colors
Primary
L:bg-black
D:bg-white
Accent
L:#35e686
D:#35e686
Header
L:#e4e8ea
D:bg-black
4. Buttons
5. Icons
6. Inputs
7. Badge
v1.0
v1.0