Nazwany kolor · #F49325
Pesto Calabrese
Pesto Calabrese to #F49325: rgb(244 147 37), hsl(32 90% 55%), oklch(0.749 0.161 62.4). Zobacz odcienie jaśniejsze i ciemniejsze, harmonie, kontrast WCAG i APCA oraz kod CSS, Tailwind v4 i SCSS.
What does Orange mean? → · Pesto Calabrese color name →
#F49325
oklch(0.749 0.161 62.4)
Konwersje koloru
- HEX
- #f49325
- RGB
- rgb(244 147 37)
- HSL
- hsl(32 90% 55%)
- HWB
- hwb(32 15% 4%)
- OKLCH
- oklch(0.749 0.161 62.4)
- OKLab
- oklab(0.749 0.075 0.143)
- CIE Lab
- lab(70.29 32.3 68.1)
- LCH
- lch(70.29 75.38 64.6)
- CMYK
- cmyk(0% 40% 85% 4%)
Odcienie jaśniejsze · Odcienie ciemniejsze · Tony
Odcienie jaśniejsze
- F69F47
- F8AA60
- FAB576
- FBC08B
- FDCB9F
- FED5B3
- FEE0C6
- FFEAD9
- FFF5EC
Odcienie ciemniejsze
- D47F1F
- B56C19
- 975913
- 7A470D
- 5E3608
- 442504
- 2B1602
- 140800
- 030100
Tony
- E99238
- DD9146
- D28F51
- C68D5A
- BB8C62
- AF8A69
- A38770
- 988575
- 8C837B
Harmonie kolorów
Komplementarna +180°
- F49325
Pesto Calabrese
- 4FB7FF
≈ Glitter Lake
Analogowa -30° +30°
- F49325
Pesto Calabrese
- FF856E
≈ Miami Coral
- D0A900
≈ Prehnite Yellow
Triada +120° +240°
- F49325
Pesto Calabrese
- 00C9B5
≈ Pristine Oceanic
- C193FF
≈ Liliac
Komplementarna rozszczepiona +150° +210°
- F49325
Pesto Calabrese
- 00C3DE
≈ Caribbean Blue
- 92A8FF
≈ Widowmaker
Tetrada +90° +180° +270°
- F49325
Pesto Calabrese
- 4BCA7A
≈ Emerald Reflection
- 4FB7FF
≈ Glitter Lake
- E884DA
≈ Blushed Bombshell
Kontrast i dostępność
Ag
FailNa bieli
WCAG 2.32:1 · APCA Lc 45
Ag
AAANa czerni
WCAG 9.04:1 · APCA Lc 57
Najlepszy kolor tekstu: #000000
WCAG 9.04:1 (AAA) · APCA Lc 57
Contrast pairs
Fragmenty kodu
CSS
:root {
--pesto-calabrese: #f49325;
--pesto-calabrese-rgb: 244 147 37;
--pesto-calabrese-oklch: oklch(0.749 0.161 62.4);
}
.element {
color: var(--pesto-calabrese);
background-color: hsl(32 90% 55%);
border-color: oklch(0.749 0.161 62.4);
}Tailwind CSS v4
@theme {
--color-pesto-calabrese: #f49325;
--color-pesto-calabrese-50: #ffecc6;
--color-pesto-calabrese-100: #ffddb0;
--color-pesto-calabrese-200: #ffc68a;
--color-pesto-calabrese-300: #f0a558;
--color-pesto-calabrese-400: #e0851b;
--color-pesto-calabrese-500: #ce6600;
--color-pesto-calabrese-600: #ae5700;
--color-pesto-calabrese-700: #8c4600;
--color-pesto-calabrese-800: #693100;
--color-pesto-calabrese-900: #4a2100;
--color-pesto-calabrese-950: #301000;
}SCSS
$pesto-calabrese: #f49325;
$pesto-calabrese-rgb: 244, 147, 37;
$pesto-calabrese-light: mix(#fff, $pesto-calabrese, 20%);
$pesto-calabrese-dark: mix(#000, $pesto-calabrese, 20%);
.element {
color: $pesto-calabrese;
box-shadow: 0 0 0 2px rgba($pesto-calabrese, 0.35);
}