Nazwany kolor · #F2AEB8
Exclusively Yours
Exclusively Yours to #F2AEB8: rgb(242 174 184), hsl(351 72% 82%), oklch(0.817 0.081 9.3). Zobacz odcienie jaśniejsze i ciemniejsze, harmonie, kontrast WCAG i APCA oraz kod CSS, Tailwind v4 i SCSS.
What does Pink mean? → · Exclusively Yours color name →
#F2AEB8
oklch(0.817 0.081 9.3)
Konwersje koloru
- HEX
- #f2aeb8
- RGB
- rgb(242 174 184)
- HSL
- hsl(351 72% 82%)
- HWB
- hwb(351 68% 5%)
- OKLCH
- oklch(0.817 0.081 9.3)
- OKLab
- oklab(0.817 0.079 0.013)
- CIE Lab
- lab(77.88 26.62 5.3)
- LCH
- lch(77.88 27.15 11.3)
- CMYK
- cmyk(0% 28% 24% 5%)
Odcienie jaśniejsze · Odcienie ciemniejsze · Tony
Odcienie jaśniejsze
- F4B6BF
- F6BEC6
- F7C6CD
- F9CED4
- FAD6DB
- FBDFE2
- FDE7E9
- FEEFF0
- FEF7F8
Odcienie ciemniejsze
- D297A0
- B48088
- 966A71
- 79555B
- 5E4145
- 432E31
- 2B1C1E
- 140B0C
- 030102
Tony
- E6A9B2
- DBA5AD
- CFA0A7
- C49CA1
- B9979C
- AD9396
- A28E90
- 97898B
- 8B8585
Harmonie kolorów
Komplementarna +180°
- F2AEB8
Exclusively Yours
- 83D4CE
≈ Water Wonder
Analogowa -30° +30°
- F2AEB8
Exclusively Yours
- E7AFD4
≈ Flower Power
- F2B29D
≈ Stucco Wall
Triada +120° +240°
- F2AEB8
Exclusively Yours
- B3CE97
≈ Greenhorn
- 9BC8F6
≈ Baby Blue Eyes
Komplementarna rozszczepiona +150° +210°
- F2AEB8
Exclusively Yours
- 96D4B1
≈ Vista Blue
- 86D0E7
≈ Summer Splash
Tetrada +90° +180° +270°
- F2AEB8
Exclusively Yours
- D0C588
≈ Tyrant Skull
- 83D4CE
≈ Water Wonder
- B8BEF7
≈ Purple Illusion
Kontrast i dostępność
Ag
FailNa bieli
WCAG 1.82:1 · APCA Lc 34
Ag
AAANa czerni
WCAG 11.52:1 · APCA Lc 69
Najlepszy kolor tekstu: #000000
WCAG 11.52:1 (AAA) · APCA Lc 69
Contrast pairs
Fragmenty kodu
CSS
:root {
--exclusively-yours: #f2aeb8;
--exclusively-yours-rgb: 242 174 184;
--exclusively-yours-oklch: oklch(0.817 0.081 9.3);
}
.element {
color: var(--exclusively-yours);
background-color: hsl(351 72% 82%);
border-color: oklch(0.817 0.081 9.3);
}Tailwind CSS v4
@theme {
--color-exclusively-yours: #f2aeb8;
--color-exclusively-yours-50: #ffecef;
--color-exclusively-yours-100: #ffdde1;
--color-exclusively-yours-200: #f5c7cb;
--color-exclusively-yours-300: #dda7ad;
--color-exclusively-yours-400: #c98b94;
--color-exclusively-yours-500: #b46f7b;
--color-exclusively-yours-600: #985e68;
--color-exclusively-yours-700: #7a4b53;
--color-exclusively-yours-800: #5a363d;
--color-exclusively-yours-900: #3f252a;
--color-exclusively-yours-950: #281418;
}SCSS
$exclusively-yours: #f2aeb8;
$exclusively-yours-rgb: 242, 174, 184;
$exclusively-yours-light: mix(#fff, $exclusively-yours, 20%);
$exclusively-yours-dark: mix(#000, $exclusively-yours, 20%);
.element {
color: $exclusively-yours;
box-shadow: 0 0 0 2px rgba($exclusively-yours, 0.35);
}