Created at 06/09/2025 15:28
TypeScript Component Playground
TS Blue
#3178c6
Compile Beige
#f1f1f1
Logic Lime
#b9fbc0
Interface Indigo
#5f0f40
Typed Plum
#9a031e
Syntax Slate
#6c757d
The palette consists of Light, Dark colors. Accent colors Logic Lime #b9fbc0 and Typed Plum #9a031e. Palette has Cool, Neutral, Warm colors temperature.
Palette TypeScript Component Playground has combination of 6 codes colors:
HEX: #3178c6, RGB: (49, 120, 198); HEX: #f1f1f1, RGB: (241, 241, 241); HEX: #b9fbc0, RGB: (185, 251, 192)
HEX: #5f0f40, RGB: (95, 15, 64); HEX: #9a031e, RGB: (154, 3, 30); HEX: #6c757d, RGB: (108, 117, 125)
Simplified version of palette colors
Tint of steelblue, Tint of whitesmoke, Shade of palegreen, Tint of Purple, Tint of brown, Tint of slategrey
Color scheme was created by colorscheme
Colors codes in palette
TypeScript Component Playground color codes HEX, RGB information in table
| Color | HEX | RGB | Name | Alternative name |
| #3178c6 | #3178c6 | RGB(49, 120, 198) | TS Blue | — |
| #f1f1f1 | #f1f1f1 | RGB(241, 241, 241) | Compile Beige | — |
| #b9fbc0 | #b9fbc0 | RGB(185, 251, 192) | Logic Lime | — |
| #5f0f40 | #5f0f40 | RGB(95, 15, 64) | Interface Indigo | — |
| #9a031e | #9a031e | RGB(154, 3, 30) | Typed Plum | — |
| #6c757d | #6c757d | RGB(108, 117, 125) | Syntax Slate | Pompeii Ash |
Color Palette Contrast
5 color pairs have low contrast and need improvement which may impact readability.
| Text Color | Background Color | Contrast Ratio |
#3178c6 | #9a031e | 1.92 |
#3178c6 | #6c757d | 1.03 |
#f1f1f1 | #b9fbc0 | 1.05 |
#5f0f40 | #9a031e | 1.47 |
#9a031e | #6c757d | 1.86 |
