Nazwany kolor · #76C1E1
Bright Spark
Bright Spark to #76C1E1: rgb(118 193 225), hsl(198 64% 67%), oklch(0.774 0.087 227.2). Zobacz odcienie jaśniejsze i ciemniejsze, harmonie, kontrast WCAG i APCA oraz kod CSS, Tailwind v4 i SCSS.
What does Cyan mean? → · Bright Spark color name →
#76C1E1
oklch(0.774 0.087 227.2)
Konwersje koloru
- HEX
- #76c1e1
- RGB
- rgb(118 193 225)
- HSL
- hsl(198 64% 67%)
- HWB
- hwb(198 46% 12%)
- OKLCH
- oklch(0.774 0.087 227.2)
- OKLab
- oklab(0.774 -0.059 -0.064)
- CIE Lab
- lab(74.08 -17.84 -23.74)
- LCH
- lch(74.08 29.69 233.1)
- CMYK
- cmyk(48% 14% 0% 12%)
Odcienie jaśniejsze · Odcienie ciemniejsze · Tony
Odcienie jaśniejsze
- 85C7E4
- 93CEE7
- A1D4EA
- AFDAEE
- BDE0F1
- CAE6F4
- D7EDF6
- E5F3F9
- F2F9FC
Odcienie ciemniejsze
- 66A7C4
- 568FA7
- 47778B
- 385F70
- 294956
- 1C343E
- 0F2027
- 050E12
- 010202
Tony
- 78BAD7
- 7AB4CD
- 7CADC3
- 7DA7B9
- 7EA0B0
- 7F9AA6
- 80939C
- 808D93
- 808689
Harmonie kolorów
Komplementarna +180°
- 76C1E1
Bright Spark
- E4A585
≈ Peach Nougat
Analogowa -30° +30°
- 76C1E1
Bright Spark
- 6CC7C9
≈ Paradise Sky
- 92B8ED
≈ Electric Eel
Triada +120° +240°
- 76C1E1
Bright Spark
- E09FC0
≈ Pink Begonia
- BBBA77
≈ Liminal Yellow
Komplementarna rozszczepiona +150° +210°
- 76C1E1
Bright Spark
- E89FA1
≈ Cosy Summer Sunset
- D5AF75
≈ Drops of Honey
Tetrada +90° +180° +270°
- 76C1E1
Bright Spark
- CDA4DB
≈ Spring Wisteria
- E4A585
≈ Peach Nougat
- 9BC38C
≈ Picnic
Kontrast i dostępność
Ag
FailNa bieli
WCAG 2.00:1 · APCA Lc 39
Ag
AAANa czerni
WCAG 10.48:1 · APCA Lc 64
Najlepszy kolor tekstu: #000000
WCAG 10.48:1 (AAA) · APCA Lc 64
Contrast pairs
Fragmenty kodu
CSS
:root {
--bright-spark: #76c1e1;
--bright-spark-rgb: 118 193 225;
--bright-spark-oklch: oklch(0.774 0.087 227.2);
}
.element {
color: var(--bright-spark);
background-color: hsl(198 64% 67%);
border-color: oklch(0.774 0.087 227.2);
}Tailwind CSS v4
@theme {
--color-bright-spark: #76c1e1;
--color-bright-spark-50: #ddfbff;
--color-bright-spark-100: #cbeeff;
--color-bright-spark-200: #aedcf3;
--color-bright-spark-300: #88c1db;
--color-bright-spark-400: #63a9c7;
--color-bright-spark-500: #3b91b3;
--color-bright-spark-600: #337b97;
--color-bright-spark-700: #296379;
--color-bright-spark-800: #1b4959;
--color-bright-spark-900: #11323e;
--color-bright-spark-950: #041e28;
}SCSS
$bright-spark: #76c1e1;
$bright-spark-rgb: 118, 193, 225;
$bright-spark-light: mix(#fff, $bright-spark, 20%);
$bright-spark-dark: mix(#000, $bright-spark, 20%);
.element {
color: $bright-spark;
box-shadow: 0 0 0 2px rgba($bright-spark, 0.35);
}