Created at 07/19/2025 07:27
Design System Access Layer
- UI Layer Blue#93c5fd
- Structure Sand#fef9c3
- Guideline Gray#d1d5db
- System Purple#a78bfa
- Spacing White#f8fafc
- Grid Red#f87171
The palette consists of Light colors. Accent colors UI Layer Blue #93c5fd and Structure Sand #fef9c3. Palette has Cool, Warm, Neutral colors temperature.
By lightness, this palette runs from #F87171 (darkest) to #F8FAFC (lightest). The lightness range is moderate.
Overall saturation feels vivid (higher chroma).
Some hue pairs sit near complementary positions — you may read this as complementary contrast (loose heuristic).
Overall temperature among swatches leans cool.
HEX codes (sorted): #93C5FD, #A78BFA, #D1D5DB, #F87171, #F8FAFC, #FEF9C3
Palette Design System Access Layer has combination of 6 codes colors:
HEX: #93c5fd, RGB: (147, 197, 253); HEX: #fef9c3, RGB: (254, 249, 195); HEX: #d1d5db, RGB: (209, 213, 219)
HEX: #a78bfa, RGB: (167, 139, 250); HEX: #f8fafc, RGB: (248, 250, 252); HEX: #f87171, RGB: (248, 113, 113)
Simplified version of palette colors
Tint of lightskyblue, Tint of lemonchiffon, Shade of lightgrey, Shade of mediumpurple, Shade of whitesmoke, Tint of lightcoral
Color scheme was created by colorstudio
Colors codes in palette
Design System Access Layer color codes HEX, RGB information in table
| Color | HEX | RGB | Name | Alternative name |
| #93c5fd | #93c5fd | RGB(147, 197, 253) | UI Layer Blue | — |
| #fef9c3 | #fef9c3 | RGB(254, 249, 195) | Structure Sand | — |
| #d1d5db | #d1d5db | RGB(209, 213, 219) | Guideline Gray | — |
| #a78bfa | #a78bfa | RGB(167, 139, 250) | System Purple | — |
| #f8fafc | #f8fafc | RGB(248, 250, 252) | Spacing White | — |
| #f87171 | #f87171 | RGB(248, 113, 113) | Grid Red | — |
Color Palette Contrast
11 color pairs have low contrast and need improvement which may impact readability.
| Text Color | Background Color | Contrast Ratio |
#93c5fd | #fef9c3 | 1.67 |
#93c5fd | #d1d5db | 1.22 |
#93c5fd | #a78bfa | 1.5 |
#93c5fd | #f8fafc | 1.72 |
#93c5fd | #f87171 | 1.53 |
#fef9c3 | #d1d5db | 1.37 |
Image palette Design System Access Layer png
Export Palette
Download the "Design System Access Layer" in multiple formats for seamless integration into your design projects.
Available formats: