Named color · #F7C5A0
Shrimp Toast
Shrimp Toast is #F7C5A0: rgb(247 197 160), hsl(26 84% 80%), oklch(0.859 0.075 58). See tints, shades, harmonies, WCAG & APCA contrast, and CSS, Tailwind v4 & SCSS code.
What does Orange mean? → · Shrimp Toast color name →
#F7C5A0
oklch(0.859 0.075 58)
Color conversions
- HEX
- #f7c5a0
- RGB
- rgb(247 197 160)
- HSL
- hsl(26 84% 80%)
- HWB
- hwb(26 63% 3%)
- OKLCH
- oklch(0.859 0.075 58)
- OKLab
- oklab(0.859 0.04 0.064)
- CIE Lab
- lab(83.36 14.76 25.74)
- LCH
- lch(83.36 29.68 60.2)
- CMYK
- cmyk(0% 20% 35% 3%)
Tints · Shades · Tones
Tints
- F8CBAA
- F9D1B3
- FAD7BD
- FBDCC6
- FCE2D0
- FDE8D9
- FDEEE3
- FEF3EC
- FFF9F5
Shades
- D7AB8B
- B79276
- 997961
- 7C614E
- 604B3B
- 453529
- 2C2119
- 150E09
- 030201
Tones
- EBBE9D
- DEB79A
- D2B097
- C6A994
- BAA291
- AE9B8D
- A3948A
- 978E87
- 8B8783
Color harmonies
Complementary +180°
- F7C5A0
Shrimp Toast
- A2D8FD
≈ Malmö FF
Analogous -30° +30°
- F7C5A0
Shrimp Toast
- FEBEB5
≈ Melon Water
- E5CE98
≈ Honeycomb Glow
Triadic +120° +240°
- F7C5A0
Shrimp Toast
- 9AE1D0
≈ Beach Glass
- D6C7FC
≈ Innocent Snowdrop
Split-complementary +150° +210°
- F7C5A0
Shrimp Toast
- 94DFEA
≈ Photon Barrier
- BDD0FF
≈ Ice Cold Stare
Tetradic +90° +180° +270°
- F7C5A0
Shrimp Toast
- B0DFB5
≈ Celtic Spring
- A2D8FD
≈ Malmö FF
- ECC0EA
≈ Purple’s Baby Sister
Contrast & accessibility
Ag
FailOn white
WCAG 1.56:1 · APCA Lc 26
Ag
AAAOn black
WCAG 13.44:1 · APCA Lc 77
Best text color: #000000
WCAG 13.44:1 (AAA) · APCA Lc 77
Contrast pairs
Code snippets
CSS
:root {
--shrimp-toast: #f7c5a0;
--shrimp-toast-rgb: 247 197 160;
--shrimp-toast-oklch: oklch(0.859 0.075 58);
}
.element {
color: var(--shrimp-toast);
background-color: hsl(26 84% 80%);
border-color: oklch(0.859 0.075 58);
}Tailwind CSS v4
@theme {
--color-shrimp-toast: #f7c5a0;
--color-shrimp-toast-50: #fff1e0;
--color-shrimp-toast-100: #fce3cf;
--color-shrimp-toast-200: #edcdb5;
--color-shrimp-toast-300: #d5af91;
--color-shrimp-toast-400: #c19472;
--color-shrimp-toast-500: #ac7a53;
--color-shrimp-toast-600: #916747;
--color-shrimp-toast-700: #755238;
--color-shrimp-toast-800: #573b28;
--color-shrimp-toast-900: #3c291b;
--color-shrimp-toast-950: #26170b;
}SCSS
$shrimp-toast: #f7c5a0;
$shrimp-toast-rgb: 247, 197, 160;
$shrimp-toast-light: mix(#fff, $shrimp-toast, 20%);
$shrimp-toast-dark: mix(#000, $shrimp-toast, 20%);
.element {
color: $shrimp-toast;
box-shadow: 0 0 0 2px rgba($shrimp-toast, 0.35);
}