Nazwany kolor · #FF6301
Chos Garden Marigold
Chos Garden Marigold to #FF6301: rgb(255 99 1), hsl(23 100% 50%), oklch(0.692 0.207 42.5). Zobacz odcienie jaśniejsze i ciemniejsze, harmonie, kontrast WCAG i APCA oraz kod CSS, Tailwind v4 i SCSS.
What does Red mean? → · Chos Garden Marigold color name →
#FF6301
oklch(0.692 0.207 42.5)
Konwersje koloru
- HEX
- #ff6301
- RGB
- rgb(255 99 1)
- HSL
- hsl(23 100% 50%)
- HWB
- hwb(23 0% 0%)
- OKLCH
- oklch(0.692 0.207 42.5)
- OKLab
- oklab(0.692 0.152 0.14)
- CIE Lab
- lab(62.67 58.3 72.27)
- LCH
- lch(62.67 92.85 51.1)
- CMYK
- cmyk(0% 61% 100% 0%)
Odcienie jaśniejsze · Odcienie ciemniejsze · Tony
Odcienie jaśniejsze
- FF7637
- FF8753
- FF976B
- FFA781
- FFB697
- FFC5AC
- FFD4C1
- FFE2D5
- FFF1EA
Odcienie ciemniejsze
- DE5501
- BE4701
- 9E3A00
- 802E00
- 632100
- 481600
- 2E0B00
- 160300
- 030000
Tony
- F36927
- E76E38
- DB7245
- CF7550
- C3785A
- B67B63
- A97C6B
- 9C7E72
- 8E7F79
Harmonie kolorów
Komplementarna +180°
- FF6301
Chos Garden Marigold
- 00ADD5
≈ Battery Charged Blue
Analogowa -30° +30°
- FF6301
Chos Garden Marigold
- FF5879
≈ Watermelon Candy
- D38B00
≈ End of Summer
Triada +120° +240°
- FF6301
Chos Garden Marigold
- 00B880
≈ April Fool’s Red
- 8F8BFF
≈ Lavender Blue Shadow
Komplementarna rozszczepiona +150° +210°
- FF6301
Chos Garden Marigold
- 00B3AF
≈ Laguna Green
- 449FFF
≈ Sky Dancer
Tetrada +90° +180° +270°
- FF6301
Chos Garden Marigold
- 6AB300
≈ Extra Life
- 00ADD5
≈ Battery Charged Blue
- C76DF6
≈ Easter Purple
Kontrast i dostępność
Ag
FailNa bieli
WCAG 2.98:1 · APCA Lc 55
Ag
AAANa czerni
WCAG 7.03:1 · APCA Lc 46
Najlepszy kolor tekstu: #000000
WCAG 7.03:1 (AAA) · APCA Lc 46
Contrast pairs
Fragmenty kodu
CSS
:root {
--chos-garden-marigold: #ff6301;
--chos-garden-marigold-rgb: 255 99 1;
--chos-garden-marigold-oklch: oklch(0.692 0.207 42.5);
}
.element {
color: var(--chos-garden-marigold);
background-color: hsl(23 100% 50%);
border-color: oklch(0.692 0.207 42.5);
}Tailwind CSS v4
@theme {
--color-chos-garden-marigold: #ff6301;
--color-chos-garden-marigold-50: #ffe3c5;
--color-chos-garden-marigold-100: #ffd2af;
--color-chos-garden-marigold-200: #ffb789;
--color-chos-garden-marigold-300: #ff9157;
--color-chos-garden-marigold-400: #fe6a20;
--color-chos-garden-marigold-500: #ed3e00;
--color-chos-garden-marigold-600: #c83600;
--color-chos-garden-marigold-700: #a12c00;
--color-chos-garden-marigold-800: #791d00;
--color-chos-garden-marigold-900: #551300;
--color-chos-garden-marigold-950: #390300;
}SCSS
$chos-garden-marigold: #ff6301;
$chos-garden-marigold-rgb: 255, 99, 1;
$chos-garden-marigold-light: mix(#fff, $chos-garden-marigold, 20%);
$chos-garden-marigold-dark: mix(#000, $chos-garden-marigold, 20%);
.element {
color: $chos-garden-marigold;
box-shadow: 0 0 0 2px rgba($chos-garden-marigold, 0.35);
}