Nazwany kolor · #F0B073
Orange Salmonberry
Orange Salmonberry to #F0B073: rgb(240 176 115), hsl(29 81% 70%), oklch(0.804 0.108 63.9). Zobacz odcienie jaśniejsze i ciemniejsze, harmonie, kontrast WCAG i APCA oraz kod CSS, Tailwind v4 i SCSS.
What does Orange mean? → · Orange Salmonberry color name →
#F0B073
oklch(0.804 0.108 63.9)
Konwersje koloru
- HEX
- #f0b073
- RGB
- rgb(240 176 115)
- HSL
- hsl(29 81% 70%)
- HWB
- hwb(29 45% 6%)
- OKLCH
- oklch(0.804 0.108 63.9)
- OKLab
- oklab(0.804 0.047 0.097)
- CIE Lab
- lab(77.01 19.13 40.71)
- LCH
- lch(77.01 44.98 64.8)
- CMYK
- cmyk(0% 27% 52% 6%)
Odcienie jaśniejsze · Odcienie ciemniejsze · Tony
Odcienie jaśniejsze
- F2B882
- F4C090
- F6C89E
- F7D0AC
- F9D8BA
- FAE0C8
- FCE8D6
- FDEFE4
- FEF7F1
Odcienie ciemniejsze
- D19963
- B28254
- 956C45
- 785636
- 5D4228
- 432E1B
- 2A1C0F
- 140B05
- 030101
Tony
- E5AB75
- D9A778
- CEA279
- C39D7B
- B7987C
- AC947E
- A18F7E
- 968A7F
- 8B8580
Harmonie kolorów
Komplementarna +180°
- F0B073
Orange Salmonberry
- 81C7FF
≈ Chromis Damsel Blue
Analogowa -30° +30°
- F0B073
Orange Salmonberry
- FCA591
≈ Coral Serenade
- D6BE6A
≈ Mustard Oil
Triada +120° +240°
- F0B073
Orange Salmonberry
- 61D6C7
≈ Turquoise Twist
- CEAEF8
≈ Teasel Dipsacus
Komplementarna rozszczepiona +150° +210°
- F0B073
Orange Salmonberry
- 5FD1E9
≈ Slick Blue
- ABBBFF
≈ Pastel Blue
Tetrada +90° +180° +270°
- F0B073
Orange Salmonberry
- 85D49F
≈ May Apple
- 81C7FF
≈ Chromis Damsel Blue
- EAA5DC
≈ Candy Floss
Kontrast i dostępność
Ag
FailNa bieli
WCAG 1.88:1 · APCA Lc 36
Ag
AAANa czerni
WCAG 11.16:1 · APCA Lc 67
Najlepszy kolor tekstu: #000000
WCAG 11.16:1 (AAA) · APCA Lc 67
Contrast pairs
Fragmenty kodu
CSS
:root {
--orange-salmonberry: #f0b073;
--orange-salmonberry-rgb: 240 176 115;
--orange-salmonberry-oklch: oklch(0.804 0.108 63.9);
}
.element {
color: var(--orange-salmonberry);
background-color: hsl(29 81% 70%);
border-color: oklch(0.804 0.108 63.9);
}Tailwind CSS v4
@theme {
--color-orange-salmonberry: #f0b073;
--color-orange-salmonberry-50: #fff0d5;
--color-orange-salmonberry-100: #ffe1c3;
--color-orange-salmonberry-200: #f5cca4;
--color-orange-salmonberry-300: #dead7c;
--color-orange-salmonberry-400: #cb9057;
--color-orange-salmonberry-500: #b7752e;
--color-orange-salmonberry-600: #9b6329;
--color-orange-salmonberry-700: #7c4f20;
--color-orange-salmonberry-800: #5d3916;
--color-orange-salmonberry-900: #41270e;
--color-orange-salmonberry-950: #291502;
}SCSS
$orange-salmonberry: #f0b073;
$orange-salmonberry-rgb: 240, 176, 115;
$orange-salmonberry-light: mix(#fff, $orange-salmonberry, 20%);
$orange-salmonberry-dark: mix(#000, $orange-salmonberry, 20%);
.element {
color: $orange-salmonberry;
box-shadow: 0 0 0 2px rgba($orange-salmonberry, 0.35);
}