Generate Palette
  1. Color Palettes
  2. React Component Library Dark Mode

React Component Library Dark Mode

  • React Base Black
    #0f1115
  • Props Purple
    #8e7cc3
  • State Active Cyan
    #00cfc1
  • Focus Ring Yellow
    #ffda3d
  • Shadow UI Grey
    #b5b5b5
  • Card Border White
    #f4f4f4
  26
Created at 07/11/2025 09:40
bybad_colors
The palette consists of Dark, Light colors. Accent colors State Active Cyan #00cfc1 and Focus Ring Yellow #ffda3d. Palette has Neutral, Cool, Warm colors temperature.

By lightness, this palette runs from #0F1115 (darkest) to #F4F4F4 (lightest). The lightness range is wide.

Saturation is mixed — 3 muted and 2 vivid out of 6 colors.

Some colors sit roughly opposite each other on the color wheel, giving the palette complementary contrast.

Overall temperature among swatches leans cool (2 of 6).

HEX codes (sorted): #00CFC1, #0F1115, #8E7CC3, #B5B5B5, #F4F4F4, #FFDA3D

Palette React Component Library Dark Mode combines 6 color codes:
HEX: #0f1115, RGB: (15, 17, 21); HEX: #8e7cc3, RGB: (142, 124, 195); HEX: #00cfc1, RGB: (0, 207, 193)
HEX: #ffda3d, RGB: (255, 218, 61); HEX: #b5b5b5, RGB: (181, 181, 181); HEX: #f4f4f4, RGB: (244, 244, 244)
Simplified version of palette colors
Tint of Black, Tint of Medium Purple, Shade of Medium Turquoise, Tint of Gold, Shade of Silver, Shade of White Smoke
Color scheme was created by bad_colors

Color codes in palette

React Component Library Dark Mode color codes HEX, RGB information in table

Color HEX RGB Name Alternative name
#0f1115 #0f1115 RGB(15, 17, 21)React Base Black—
#8e7cc3 #8e7cc3 RGB(142, 124, 195)Props Purple—
#00cfc1 #00cfc1 RGB(0, 207, 193)State Active Cyan—
#ffda3d #ffda3d RGB(255, 218, 61)Focus Ring Yellow—
#b5b5b5 #b5b5b5 RGB(181, 181, 181)Shadow UI GreyBrainstem Grey
#f4f4f4 #f4f4f4 RGB(244, 244, 244)Card Border White—

Color Palette Contrast

8 color pairs have low contrast and need improvement which may impact readability.
Text Color Background Color Contrast Ratio
#8e7cc3
#00cfc1
1.83
#8e7cc3
#b5b5b5
1.75
#00cfc1
#ffda3d
1.43
#00cfc1
#b5b5b5
1.04
#00cfc1
#f4f4f4
1.78
#ffda3d
#b5b5b5
1.49

Image palette React Component Library Dark Mode png

React Component Library Dark Mode color palette: React Base Black, Props Purple, State Active Cyan, Focus Ring Yellow
 Download image