Named color · #F3C12C
Freesia
Freesia is #F3C12C: rgb(243 193 44), hsl(45 89% 56%), oklch(0.833 0.16 88.3). See tints, shades, harmonies, WCAG & APCA contrast, and CSS, Tailwind v4 & SCSS code.
What does Yellow mean? → · Freesia color name →
#F3C12C
oklch(0.833 0.16 88.3)
Color conversions
- HEX
- #f3c12c
- RGB
- rgb(243 193 44)
- HSL
- hsl(45 89% 56%)
- HWB
- hwb(45 17% 5%)
- OKLCH
- oklch(0.833 0.16 88.3)
- OKLab
- oklab(0.833 0.005 0.16)
- CIE Lab
- lab(80.92 9.07 74.37)
- LCH
- lch(80.92 74.92 83.1)
- CMYK
- cmyk(0% 21% 82% 5%)
Tints · Shades · Tones
Tints
- F4C84F
- F6CE69
- F7D57F
- F8DB93
- F9E1A6
- FBE7B9
- FCEDCB
- FDF3DC
- FEF9EE
Shades
- D3A725
- B48F1E
- 977717
- 7A5F11
- 5E490A
- 443405
- 2B2002
- 140E01
- 030200
Tones
- E7BB40
- DBB44E
- CFAE58
- C4A861
- B8A168
- AD9B6E
- A19474
- 968D78
- 8B877C
Color harmonies
Complementary +180°
- F3C12C
Freesia
- B1C7FF
≈ Night Snow
Analogous -30° +30°
- F3C12C
Freesia
- FFB67D
≈ Go Go Mango
- BFD64F
≈ Frog Prince
Triadic +120° +240°
- F3C12C
Freesia
- 00E1F9
≈ Cold Heights
- FFA1FB
≈ Jigglypuff
Split-complementary +150° +210°
- F3C12C
Freesia
- 8CD1FF
≈ Long Island Sound
- D0BBFF
≈ Lavender Tonic
Tetradic +90° +180° +270°
- F3C12C
Freesia
- 00E8C9
≈ Fake Jade
- B1C7FF
≈ Night Snow
- FFACC8
≈ Heartfelt
Contrast & accessibility
Ag
FailOn white
WCAG 1.68:1 · APCA Lc 30
Ag
AAAOn black
WCAG 12.47:1 · APCA Lc 73
Best text color: #000000
WCAG 12.47:1 (AAA) · APCA Lc 73
Contrast pairs
Code snippets
CSS
:root {
--freesia: #f3c12c;
--freesia-rgb: 243 193 44;
--freesia-oklch: oklch(0.833 0.16 88.3);
}
.element {
color: var(--freesia);
background-color: hsl(45 89% 56%);
border-color: oklch(0.833 0.16 88.3);
}Tailwind CSS v4
@theme {
--color-freesia: #f3c12c;
--color-freesia-50: #fff4c1;
--color-freesia-100: #fce6ab;
--color-freesia-200: #eed282;
--color-freesia-300: #d7b34b;
--color-freesia-400: #c59700;
--color-freesia-500: #b17c00;
--color-freesia-600: #966900;
--color-freesia-700: #785400;
--color-freesia-800: #5a3c00;
--color-freesia-900: #3f2a00;
--color-freesia-950: #281700;
}SCSS
$freesia: #f3c12c;
$freesia-rgb: 243, 193, 44;
$freesia-light: mix(#fff, $freesia, 20%);
$freesia-dark: mix(#000, $freesia, 20%);
.element {
color: $freesia;
box-shadow: 0 0 0 2px rgba($freesia, 0.35);
}