FleetGrid: two design directions, six themes
Both directions use the same screens, the same step order and the same copy rules. They differ in shape, color and attitude. Open each one, switch between its three palettes, and try light and dark.
Expressive and branded. Rounded shapes, strong color fills, more personality. Selection is a bright signal color, progress is a highway with a yellow truck, and the sign-style headers carry the brand.
Signal
Highway green and safety yellow
Steel Signal
Graphite and signal orange
Route Teal
Deep teal and lime
- Corners
- 14 to 20px, pill chips
- Selection
- Filled in the signal color, with a round badge
- Feel
- Friendly, energetic, easy to spot in sunlight
Open the Bold preview →
Restrained and official. Sharp edges, calm colors, built like equipment. Color is used sparingly and never alone: selection adds a border and a check, errors add an icon and a message. Yellow and orange are kept for warnings.
Interstate
DOT navy and graphite
Guide Sign
Highway guide green
Workshop
Graphite and burnt orange
- Corners
- 4 to 6px, no pills
- Selection
- Light tint, 2px border and a square check
- Feel
- Calm, official, reads like good equipment
Open the Premium/Mature preview →