Benannte Farbe · #FF6666
Pompelmo
Pompelmo ist #FF6666: rgb(255 102 102), hsl(0 100% 70%), oklch(0.704 0.187 23.2). Mit Tints, Shades, Harmonien, WCAG- & APCA-Kontrast sowie CSS-, Tailwind-v4- und SCSS-Code.
What does Red mean? → · Pompelmo color name →
#FF6666
oklch(0.704 0.187 23.2)
Farbumrechnungen
- HEX
- #ff6666
- RGB
- rgb(255 102 102)
- HSL
- hsl(0 100% 70%)
- HWB
- hwb(0 40% 0%)
- OKLCH
- oklch(0.704 0.187 23.2)
- OKLab
- oklab(0.704 0.172 0.074)
- CIE Lab
- lab(63.82 59.31 31.95)
- LCH
- lch(63.82 67.36 28.3)
- CMYK
- cmyk(0% 60% 60% 0%)
Tints · Shades · Tones
Tints
- FF7875
- FF8884
- FF9893
- FFA8A2
- FFB7B2
- FFC5C1
- FFD4D0
- FFE2E0
- FFF1EF
Shades
- DE5858
- BE4A4A
- 9E3C3C
- 802F2F
- 632323
- 481717
- 2E0C0C
- 160404
- 030000
Tones
- F36B69
- E76F6C
- DB736F
- CF7672
- C37975
- B67B77
- A97D79
- 9C7E7C
- 8E7F7E
Farbharmonien
Komplementär +180°
- FF6666
Pompelmo
- 00B5C1
≈ Lago Blue
Analog -30° +30°
- FF6666
Pompelmo
- F465A9
≈ Fugitive Flamingo
- F27A00
≈ Retro Nectarine
Triadisch +120° +240°
- FF6666
Pompelmo
- 49BC48
≈ Skirret Green
- 6C9DFF
≈ Blue Chaos
Geteilt komplementär +150° +210°
- FF6666
Pompelmo
- 00BA98
≈ Aoife’s Green
- 00ADEB
≈ Vivid Cerulean
Tetradisch +90° +180° +270°
- FF6666
Pompelmo
- A1A900
≈ Jīn Sè Gold
- 00B5C1
≈ Lago Blue
- A687FF
≈ Lilac Geode
Kontrast & Barrierefreiheit
Ag
FailAuf Weiß
WCAG 2.85:1 · APCA Lc 54
Ag
AAAAuf Schwarz
WCAG 7.34:1 · APCA Lc 48
Beste Textfarbe: #000000
WCAG 7.34:1 (AAA) · APCA Lc 48
Contrast pairs
Code-Snippets
CSS
:root {
--pompelmo: #ff6666;
--pompelmo-rgb: 255 102 102;
--pompelmo-oklch: oklch(0.704 0.187 23.2);
}
.element {
color: var(--pompelmo);
background-color: hsl(0 100% 70%);
border-color: oklch(0.704 0.187 23.2);
}Tailwind CSS v4
@theme {
--color-pompelmo: #ff6666;
--color-pompelmo-50: #ffe1da;
--color-pompelmo-100: #ffd0c8;
--color-pompelmo-200: #ffb4ab;
--color-pompelmo-300: #ff8e86;
--color-pompelmo-400: #f96968;
--color-pompelmo-500: #e83e46;
--color-pompelmo-600: #c4373c;
--color-pompelmo-700: #9e2c30;
--color-pompelmo-800: #761e24;
--color-pompelmo-900: #531418;
--color-pompelmo-950: #370409;
}SCSS
$pompelmo: #ff6666;
$pompelmo-rgb: 255, 102, 102;
$pompelmo-light: mix(#fff, $pompelmo, 20%);
$pompelmo-dark: mix(#000, $pompelmo, 20%);
.element {
color: $pompelmo;
box-shadow: 0 0 0 2px rgba($pompelmo, 0.35);
}