Nazwany kolor · #C26A35
Sesame Crunch
Sesame Crunch to #C26A35: rgb(194 106 53), hsl(23 57% 48%), oklch(0.616 0.13 49.3). Zobacz odcienie jaśniejsze i ciemniejsze, harmonie, kontrast WCAG i APCA oraz kod CSS, Tailwind v4 i SCSS.
What does Orange mean? → · Sesame Crunch color name →
#C26A35
oklch(0.616 0.13 49.3)
Konwersje koloru
- HEX
- #c26a35
- RGB
- rgb(194 106 53)
- HSL
- hsl(23 57% 48%)
- HWB
- hwb(23 21% 24%)
- OKLCH
- oklch(0.616 0.13 49.3)
- OKLab
- oklab(0.616 0.085 0.099)
- CIE Lab
- lab(54.61 32.89 44.82)
- LCH
- lch(54.61 55.59 53.7)
- CMYK
- cmyk(0% 45% 73% 24%)
Odcienie jaśniejsze · Odcienie ciemniejsze · Tony
Odcienie jaśniejsze
- C9794B
- D08860
- D79774
- DEA688
- E4B49B
- EAC3AF
- F0D2C3
- F5E1D7
- FAF0EB
Odcienie ciemniejsze
- A85B2D
- 8F4D25
- 773F1D
- 603115
- 49240E
- 341808
- 200D03
- 0E0401
- 020000
Tony
- BC6D3F
- B67048
- B07251
- AA7558
- A37760
- 9C7966
- 967B6D
- 8F7D74
- 887F7A
Harmonie kolorów
Komplementarna +180°
- C26A35
Sesame Crunch
- 0091BF
≈ Swimmer
Analogowa -30° +30°
- C26A35
Sesame Crunch
- C76165
≈ Stormy Passion
- AD7A00
≈ Brown Butter
Triada +120° +240°
- C26A35
Sesame Crunch
- 009C78
≈ Golf Green
- 8476CD
≈ Ube
Komplementarna rozszczepiona +150° +210°
- C26A35
Sesame Crunch
- 00979D
≈ Ocean Reef
- 5384D2
≈ Berlin Blue
Tetrada +90° +180° +270°
- C26A35
Sesame Crunch
- 589747
≈ Bredon Green
- 0091BF
≈ Swimmer
- A669B6
≈ Soft Purple
Kontrast i dostępność
Ag
FailNa bieli
WCAG 3.88:1 · APCA Lc 66
Ag
AANa czerni
WCAG 5.40:1 · APCA Lc 36
Najlepszy kolor tekstu: #000000
WCAG 5.40:1 (AA) · APCA Lc 36
Contrast pairs
Fragmenty kodu
CSS
:root {
--sesame-crunch: #c26a35;
--sesame-crunch-rgb: 194 106 53;
--sesame-crunch-oklch: oklch(0.616 0.13 49.3);
}
.element {
color: var(--sesame-crunch);
background-color: hsl(23 57% 48%);
border-color: oklch(0.616 0.13 49.3);
}Tailwind CSS v4
@theme {
--color-sesame-crunch: #c26a35;
--color-sesame-crunch-50: #ffebd4;
--color-sesame-crunch-100: #ffdcc1;
--color-sesame-crunch-200: #ffc5a1;
--color-sesame-crunch-300: #eda479;
--color-sesame-crunch-400: #dc8655;
--color-sesame-crunch-500: #c9682a;
--color-sesame-crunch-600: #aa5825;
--color-sesame-crunch-700: #88461e;
--color-sesame-crunch-800: #663215;
--color-sesame-crunch-900: #48220d;
--color-sesame-crunch-950: #2e1102;
}SCSS
$sesame-crunch: #c26a35;
$sesame-crunch-rgb: 194, 106, 53;
$sesame-crunch-light: mix(#fff, $sesame-crunch, 20%);
$sesame-crunch-dark: mix(#000, $sesame-crunch, 20%);
.element {
color: $sesame-crunch;
box-shadow: 0 0 0 2px rgba($sesame-crunch, 0.35);
}