Created at 06/09/2025 16:05
Figma Design Language Grid
- Artboard Beige#faf3dd
- Component Coral#ff6b6b
- Wireframe Blue#4ecdc4
- Master Frame Gray#ced4da
- Prototype Yellow#ffd93d
- Interaction Ink#2d3142
The palette consists of Light, Dark colors. Accent colors Wireframe Blue #4ecdc4 and Prototype Yellow #ffd93d. Palette has Neutral, Warm, Cool colors temperature.
By lightness, this palette runs from #2D3142 (darkest) to #FAF3DD (lightest). The lightness range is wide.
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): #2D3142, #4ECDC4, #CED4DA, #FAF3DD, #FF6B6B, #FFD93D
Palette Figma Design Language Grid has combination of 6 codes colors:
HEX: #faf3dd, RGB: (250, 243, 221); HEX: #ff6b6b, RGB: (255, 107, 107); HEX: #4ecdc4, RGB: (78, 205, 196)
HEX: #ced4da, RGB: (206, 212, 218); HEX: #ffd93d, RGB: (255, 217, 61); HEX: #2d3142, RGB: (45, 49, 66)
Simplified version of palette colors
Tint of cornsilk, Tint of salmon, Tint of mediumturquoise, Tint of lightgrey, Shade of gold, Tint of darkslateblue
Color scheme was created by colorday
Colors codes in palette
Figma Design Language Grid color codes HEX, RGB information in table
| Color | HEX | RGB | Name | Alternative name |
| #faf3dd | #faf3dd | RGB(250, 243, 221) | Artboard Beige | Vanilla Powder |
| #ff6b6b | #ff6b6b | RGB(255, 107, 107) | Component Coral | — |
| #4ecdc4 | #4ecdc4 | RGB(78, 205, 196) | Wireframe Blue | — |
| #ced4da | #ced4da | RGB(206, 212, 218) | Master Frame Gray | — |
| #ffd93d | #ffd93d | RGB(255, 217, 61) | Prototype Yellow | — |
| #2d3142 | #2d3142 | RGB(45, 49, 66) | Interaction Ink | — |
Color Palette Contrast
8 color pairs have low contrast and need improvement which may impact readability.
| Text Color | Background Color | Contrast Ratio |
#faf3dd | #4ecdc4 | 1.74 |
#faf3dd | #ced4da | 1.34 |
#faf3dd | #ffd93d | 1.24 |
#ff6b6b | #4ecdc4 | 1.43 |
#ff6b6b | #ced4da | 1.85 |
#4ecdc4 | #ced4da | 1.29 |
Image palette Figma Design Language Grid png
Export Palette
Download the "Figma Design Language Grid" in multiple formats for seamless integration into your design projects.
Available formats: