Generate Palette
  1. Colors palettes
  2. Modular Web UI Token Framework
Created at 07/20/2025 20:32
bypalettespicker
  11

Modular Web UI Token Framework

  • Base Gray
    #f3f4f6
  • Interactive Blue
    #1d4ed8
  • State Green
    #10b981
  • Token Coral
    #fb7185
  • Layered Yellow
    #facc15
The palette consists of Light colors. Accent colors Interactive Blue #1d4ed8 and Layered Yellow #facc15. Palette has Neutral, Cool, Warm colors temperature.

By lightness, this palette runs from #10B981 (darkest) to #F3F4F6 (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).

Warm and cool swatches are fairly balanced.

HEX codes (sorted): #10B981, #1D4ED8, #F3F4F6, #FACC15, #FB7185

Palette Modular Web UI Token Framework has combination of 5 codes colors:
HEX: #f3f4f6, RGB: (243, 244, 246); HEX: #1d4ed8, RGB: (29, 78, 216); HEX: #10b981, RGB: (16, 185, 129)
HEX: #fb7185, RGB: (251, 113, 133); HEX: #facc15, RGB: (250, 204, 21)
Simplified version of palette colors
Tint of whitesmoke, Tint of slateblue, Tint of mediumseagreen, Tint of lightcoral, Tint of gold
Color scheme was created by palettespicker

Colors codes in palette

Modular Web UI Token Framework color codes HEX, RGB information in table

Color HEX RGB Name Alternative name
#f3f4f6 #f3f4f6 RGB(243, 244, 246)Base Gray—
#1d4ed8 #1d4ed8 RGB(29, 78, 216)Interactive Blue—
#10b981 #10b981 RGB(16, 185, 129)State Green—
#fb7185 #fb7185 RGB(251, 113, 133)Token Coral—
#facc15 #facc15 RGB(250, 204, 21)Layered Yellow—

Color Palette Contrast

4 color pairs have low contrast and need improvement which may impact readability.
Text Color Background Color Contrast Ratio
#f3f4f6
#facc15
1.39
#10b981
#fb7185
1.06
#10b981
#facc15
1.65
#fb7185
#facc15
1.75

Image palette Modular Web UI Token Framework png

Modular Web UI Token Framework - #556006
 Download image