Nazwany kolor · #FEA7BD
Amélie’s Tutu
Amélie’s Tutu to #FEA7BD: rgb(254 167 189), hsl(345 98% 83%), oklch(0.82 0.106 3.2). Zobacz odcienie jaśniejsze i ciemniejsze, harmonie, kontrast WCAG i APCA oraz kod CSS, Tailwind v4 i SCSS.
What does Pink mean? → · Amélie’s Tutu color name →
#FEA7BD
oklch(0.82 0.106 3.2)
Konwersje koloru
- HEX
- #fea7bd
- RGB
- rgb(254 167 189)
- HSL
- hsl(345 98% 83%)
- HWB
- hwb(345 65% 0%)
- OKLCH
- oklch(0.82 0.106 3.2)
- OKLab
- oklab(0.82 0.105 0.006)
- CIE Lab
- lab(77.78 35.04 2.67)
- LCH
- lch(77.78 35.14 4.4)
- CMYK
- cmyk(0% 34% 26% 0%)
Odcienie jaśniejsze · Odcienie ciemniejsze · Tony
Odcienie jaśniejsze
- FFB0C3
- FFB9CA
- FFC2D0
- FFCBD7
- FFD3DE
- FFDCE4
- FFE5EB
- FFEEF2
- FFF6F8
Odcienie ciemniejsze
- DD91A4
- BD7B8C
- 9E6674
- 80525D
- 633E47
- 472C33
- 2D1A1F
- 160A0D
- 030102
Tony
- F1A3B7
- E5A0B0
- D89CAA
- CB98A4
- BF949E
- B29098
- A68C92
- 99888C
- 8D8486
Harmonie kolorów
Komplementarna +180°
- FEA7BD
Amélie’s Tutu
- 6ADACB
≈ Hammam Blue
Analogowa -30° +30°
- FEA7BD
Amélie’s Tutu
- EEAAE1
≈ Pretty Pink Piggy
- FFAC99
≈ Discreet Orange
Triada +120° +240°
- FEA7BD
Amélie’s Tutu
- B7D082
≈ Lettuce Green
- 8BCCFF
≈ Platonic Blue
Komplementarna rozszczepiona +150° +210°
- FEA7BD
Amélie’s Tutu
- 8DD8A4
≈ Patrice
- 67D6ED
≈ Electric Lemonade
Tetrada +90° +180° +270°
- FEA7BD
Amélie’s Tutu
- DBC371
≈ Chenin
- 6ADACB
≈ Hammam Blue
- B1C1FF
≈ Dried Lilac
Kontrast i dostępność
Ag
FailNa bieli
WCAG 1.82:1 · APCA Lc 34
Ag
AAANa czerni
WCAG 11.47:1 · APCA Lc 69
Najlepszy kolor tekstu: #000000
WCAG 11.47:1 (AAA) · APCA Lc 69
Contrast pairs
Fragmenty kodu
CSS
:root {
--amelie-s-tutu: #fea7bd;
--amelie-s-tutu-rgb: 254 167 189;
--amelie-s-tutu-oklch: oklch(0.82 0.106 3.2);
}
.element {
color: var(--amelie-s-tutu);
background-color: hsl(345 98% 83%);
border-color: oklch(0.82 0.106 3.2);
}Tailwind CSS v4
@theme {
--color-amelie-s-tutu: #fea7bd;
--color-amelie-s-tutu-50: #ffe9f1;
--color-amelie-s-tutu-100: #ffdae3;
--color-amelie-s-tutu-200: #fdc2ce;
--color-amelie-s-tutu-300: #e7a1b0;
--color-amelie-s-tutu-400: #d38398;
--color-amelie-s-tutu-500: #bf667f;
--color-amelie-s-tutu-600: #a1576c;
--color-amelie-s-tutu-700: #824556;
--color-amelie-s-tutu-800: #603240;
--color-amelie-s-tutu-900: #43222c;
--color-amelie-s-tutu-950: #2b1119;
}SCSS
$amelie-s-tutu: #fea7bd;
$amelie-s-tutu-rgb: 254, 167, 189;
$amelie-s-tutu-light: mix(#fff, $amelie-s-tutu, 20%);
$amelie-s-tutu-dark: mix(#000, $amelie-s-tutu, 20%);
.element {
color: $amelie-s-tutu;
box-shadow: 0 0 0 2px rgba($amelie-s-tutu, 0.35);
}