Nazwany kolor · #F485AC
Brown Knapweed
Brown Knapweed to #F485AC: rgb(244 133 172), hsl(339 83% 74%), oklch(0.749 0.141 358.7). Zobacz odcienie jaśniejsze i ciemniejsze, harmonie, kontrast WCAG i APCA oraz kod CSS, Tailwind v4 i SCSS.
What does Red mean? → · Brown Knapweed color name →
#F485AC
oklch(0.749 0.141 358.7)
Konwersje koloru
- HEX
- #f485ac
- RGB
- rgb(244 133 172)
- HSL
- hsl(339 83% 74%)
- HWB
- hwb(339 52% 4%)
- OKLCH
- oklch(0.749 0.141 358.7)
- OKLab
- oklab(0.749 0.141 -0.003)
- CIE Lab
- lab(69.07 46.42 -0.67)
- LCH
- lch(69.07 46.42 359.2)
- CMYK
- cmyk(0% 45% 30% 4%)
Odcienie jaśniejsze · Odcienie ciemniejsze · Tony
Odcienie jaśniejsze
- F792B4
- F99EBC
- FBABC4
- FCB7CC
- FEC3D5
- FFCFDD
- FFDBE5
- FFE7EE
- FFF3F6
Odcienie ciemniejsze
- D47395
- B5617F
- 975069
- 7A4054
- 5E3040
- 44212D
- 2B131B
- 14060B
- 030101
Tony
- E985A7
- DD85A3
- D2859F
- C7859A
- BB8596
- B08491
- A4838D
- 988289
- 8C8184
Harmonie kolorów
Komplementarna +180°
- F485AC
Brown Knapweed
- 00C9AF
≈ Amazonite
Analogowa -30° +30°
- F485AC
Brown Knapweed
- DE8BDA
≈ Bright Lilac
- FA8879
≈ Play ’til Dawn
Triada +120° +240°
- F485AC
Brown Knapweed
- A5BA47
≈ Clipped Grass
- 45B9FC
≈ Glitter Lake
Komplementarna rozszczepiona +150° +210°
- F485AC
Brown Knapweed
- 67C67A
≈ Soft Green
- 00C3D9
≈ The Crowd Roars!
Tetrada +90° +180° +270°
- F485AC
Brown Knapweed
- D2A82A
≈ Brassy
- 00C9AF
≈ Amazonite
- 8CA9FF
≈ Widowmaker
Kontrast i dostępność
Ag
FailNa bieli
WCAG 2.38:1 · APCA Lc 47
Ag
AAANa czerni
WCAG 8.79:1 · APCA Lc 55
Najlepszy kolor tekstu: #000000
WCAG 8.79:1 (AAA) · APCA Lc 55
Contrast pairs
Fragmenty kodu
CSS
:root {
--brown-knapweed: #f485ac;
--brown-knapweed-rgb: 244 133 172;
--brown-knapweed-oklch: oklch(0.749 0.141 358.7);
}
.element {
color: var(--brown-knapweed);
background-color: hsl(339 83% 74%);
border-color: oklch(0.749 0.141 358.7);
}Tailwind CSS v4
@theme {
--color-brown-knapweed: #f485ac;
--color-brown-knapweed-50: #ffe5f3;
--color-brown-knapweed-100: #ffd5e5;
--color-brown-knapweed-200: #ffbbd1;
--color-brown-knapweed-300: #f398b3;
--color-brown-knapweed-400: #e0789d;
--color-brown-knapweed-500: #cd5885;
--color-brown-knapweed-600: #ad4b70;
--color-brown-knapweed-700: #8b3c5a;
--color-brown-knapweed-800: #672a43;
--color-brown-knapweed-900: #491d2e;
--color-brown-knapweed-950: #2f0c1b;
}SCSS
$brown-knapweed: #f485ac;
$brown-knapweed-rgb: 244, 133, 172;
$brown-knapweed-light: mix(#fff, $brown-knapweed, 20%);
$brown-knapweed-dark: mix(#000, $brown-knapweed, 20%);
.element {
color: $brown-knapweed;
box-shadow: 0 0 0 2px rgba($brown-knapweed, 0.35);
}