Colore con nome · #F5D1B2
Barrett Quince
Barrett Quince è #F5D1B2: rgb(245 209 178), hsl(28 77% 83%), oklch(0.883 0.058 62.7). Scopri tinte, ombre, armonie, contrasto WCAG e APCA e codice CSS, Tailwind v4 e SCSS.
What does Orange mean? → · Barrett Quince color name →
#F5D1B2
oklch(0.883 0.058 62.7)
Conversioni di colore
- HEX
- #f5d1b2
- RGB
- rgb(245 209 178)
- HSL
- hsl(28 77% 83%)
- HWB
- hwb(28 70% 4%)
- OKLCH
- oklch(0.883 0.058 62.7)
- OKLab
- oklab(0.883 0.027 0.051)
- CIE Lab
- lab(86.37 9.72 20.36)
- LCH
- lch(86.37 22.56 64.5)
- CMYK
- cmyk(0% 15% 27% 4%)
Tinte · Ombre · Toni
Tinte
- F6D6BA
- F7DAC1
- F8DFC9
- F9E3D1
- FAE8D8
- FBEDE0
- FCF1E8
- FDF6F0
- FEFAF7
Ombre
- D5B59A
- B69B83
- 98816D
- 7B6857
- 5F5043
- 44392F
- 2B231D
- 15100C
- 030201
Toni
- E9C9AD
- DDC0A8
- D1B8A3
- C5B09E
- B9A899
- ADA094
- A2988F
- 96908A
- 8B8885
Armonie di colore
Complementare +180°
- F5D1B2
Barrett Quince
- B8DEFC
≈ Broad Daylight
Analogo -30° +30°
- F5D1B2
Barrett Quince
- FCCCC1
≈ Crystal Coral
- E6D8AE
≈ Honey Mist
Triadico +120° +240°
- F5D1B2
Barrett Quince
- AFE6DC
≈ Aquatic Mist
- E0D0F9
≈ Pale Lavender
Complementare divisa +150° +210°
- F5D1B2
Barrett Quince
- ADE3EF
≈ Crystal River
- CCD7FF
≈ Pale Phthalo Blue
Tetradico +90° +180° +270°
- F5D1B2
Barrett Quince
- BDE4C7
≈ Spearmints
- B8DEFC
≈ Broad Daylight
- F1CBE9
≈ Bubblegum Crisis
Contrasto e accessibilità
Ag
FailSu bianco
WCAG 1.43:1 · APCA Lc 21
Ag
AAASu nero
WCAG 14.64:1 · APCA Lc 83
Miglior colore del testo: #000000
WCAG 14.64:1 (AAA) · APCA Lc 83
Contrast pairs
Frammenti di codice
CSS
:root {
--barrett-quince: #f5d1b2;
--barrett-quince-rgb: 245 209 178;
--barrett-quince-oklch: oklch(0.883 0.058 62.7);
}
.element {
color: var(--barrett-quince);
background-color: hsl(28 77% 83%);
border-color: oklch(0.883 0.058 62.7);
}Tailwind CSS v4
@theme {
--color-barrett-quince: #f5d1b2;
--color-barrett-quince-50: #fff2e4;
--color-barrett-quince-100: #f6e4d4;
--color-barrett-quince-200: #e6d0bb;
--color-barrett-quince-300: #cdb299;
--color-barrett-quince-400: #b8977b;
--color-barrett-quince-500: #a27e5e;
--color-barrett-quince-600: #896b50;
--color-barrett-quince-700: #6e5540;
--color-barrett-quince-800: #513e2e;
--color-barrett-quince-900: #392b1f;
--color-barrett-quince-950: #23180f;
}SCSS
$barrett-quince: #f5d1b2;
$barrett-quince-rgb: 245, 209, 178;
$barrett-quince-light: mix(#fff, $barrett-quince, 20%);
$barrett-quince-dark: mix(#000, $barrett-quince, 20%);
.element {
color: $barrett-quince;
box-shadow: 0 0 0 2px rgba($barrett-quince, 0.35);
}