Nazwany kolor · #6FFFFF
Aggressive Baby Blue
Aggressive Baby Blue to #6FFFFF: rgb(111 255 255), hsl(180 100% 72%), oklch(0.922 0.124 195.2). Zobacz odcienie jaśniejsze i ciemniejsze, harmonie, kontrast WCAG i APCA oraz kod CSS, Tailwind v4 i SCSS.
What does Teal mean? → · Aggressive Baby Blue color name →
#6FFFFF
oklch(0.922 0.124 195.2)
Konwersje koloru
- HEX
- #6fffff
- RGB
- rgb(111 255 255)
- HSL
- hsl(180 100% 72%)
- HWB
- hwb(180 44% 0%)
- OKLCH
- oklch(0.922 0.124 195.2)
- OKLab
- oklab(0.922 -0.119 -0.032)
- CIE Lab
- lab(92.26 -40.36 -12.4)
- LCH
- lch(92.26 42.22 197.1)
- CMYK
- cmyk(56% 0% 0% 0%)
Odcienie jaśniejsze · Odcienie ciemniejsze · Tony
Odcienie jaśniejsze
- 83FFFF
- 95FFFF
- A5FFFF
- B4FFFF
- C2FFFF
- CFFFFF
- DCFFFF
- E8FFFF
- F4FFFF
Odcienie ciemniejsze
- 60DEDE
- 51BEBE
- 429E9E
- 348080
- 276363
- 1A4848
- 0E2E2E
- 041616
- 010303
Tony
- 75F2F2
- 7AE5E4
- 7ED8D7
- 80CBCA
- 82BEBE
- 83B1B1
- 83A5A4
- 839998
- 828C8C
Harmonie kolorów
Komplementarna +180°
- 6FFFFF
Aggressive Baby Blue
- FFDBDC
≈ Strawberry Blonde
Analogowa -30° +30°
- 6FFFFF
Aggressive Baby Blue
- 92FFD2
≈ Roller Derby
- C2EDFF
≈ Blue Java Banana
Triada +120° +240°
- 6FFFFF
Aggressive Baby Blue
- F4DBFF
≈ Lavender Savour
- FFE0B6
≈ Yellow Essence
Komplementarna rozszczepiona +150° +210°
- 6FFFFF
Aggressive Baby Blue
- FFD9ED
≈ Sweet Sachet
- FFDDCE
≈ Peaceful Peach
Tetrada +90° +180° +270°
- 6FFFFF
Aggressive Baby Blue
- E2E2FF
≈ Stoic White
- FFDBDC
≈ Strawberry Blonde
- F1EA85
≈ King’s Field
Kontrast i dostępność
Ag
FailNa bieli
WCAG 1.20:1 · APCA Lc 10
Ag
AAANa czerni
WCAG 17.42:1 · APCA Lc 94
Najlepszy kolor tekstu: #000000
WCAG 17.42:1 (AAA) · APCA Lc 94
Contrast pairs
Fragmenty kodu
CSS
:root {
--aggressive-baby-blue: #6fffff;
--aggressive-baby-blue-rgb: 111 255 255;
--aggressive-baby-blue-oklch: oklch(0.922 0.124 195.2);
}
.element {
color: var(--aggressive-baby-blue);
background-color: hsl(180 100% 72%);
border-color: oklch(0.922 0.124 195.2);
}Tailwind CSS v4
@theme {
--color-aggressive-baby-blue: #6fffff;
--color-aggressive-baby-blue-50: #cdffff;
--color-aggressive-baby-blue-100: #b8f5f6;
--color-aggressive-baby-blue-200: #93e5e7;
--color-aggressive-baby-blue-300: #5fcbcd;
--color-aggressive-baby-blue-400: #10b5b5;
--color-aggressive-baby-blue-500: #009ea0;
--color-aggressive-baby-blue-600: #008687;
--color-aggressive-baby-blue-700: #006b6c;
--color-aggressive-baby-blue-800: #004f4e;
--color-aggressive-baby-blue-900: #003736;
--color-aggressive-baby-blue-950: #002221;
}SCSS
$aggressive-baby-blue: #6fffff;
$aggressive-baby-blue-rgb: 111, 255, 255;
$aggressive-baby-blue-light: mix(#fff, $aggressive-baby-blue, 20%);
$aggressive-baby-blue-dark: mix(#000, $aggressive-baby-blue, 20%);
.element {
color: $aggressive-baby-blue;
box-shadow: 0 0 0 2px rgba($aggressive-baby-blue, 0.35);
}