Benannte Farbe · #487A7B
Lucky Shamrock
Lucky Shamrock ist #487A7B: rgb(72 122 123), hsl(181 26% 38%), oklch(0.545 0.054 197.3). Mit Tints, Shades, Harmonien, WCAG- & APCA-Kontrast sowie CSS-, Tailwind-v4- und SCSS-Code.
What does Teal mean? → · Lucky Shamrock color name →
#487A7B
oklch(0.545 0.054 197.3)
Farbumrechnungen
- HEX
- #487a7b
- RGB
- rgb(72 122 123)
- HSL
- hsl(181 26% 38%)
- HWB
- hwb(181 28% 52%)
- OKLCH
- oklch(0.545 0.054 197.3)
- OKLab
- oklab(0.545 -0.052 -0.016)
- CIE Lab
- lab(47.74 -17.37 -6.15)
- LCH
- lch(47.74 18.42 199.5)
- CMYK
- cmyk(41% 1% 0% 52%)
Tints · Shades · Tones
Tints
- 5A8787
- 6C9394
- 7EA0A1
- 90ADAE
- A2BBBB
- B4C8C8
- C7D6D6
- D9E3E3
- ECF1F1
Shades
- 3D696A
- 33595A
- 29494A
- 1F3A3A
- 162B2C
- 0D1D1E
- 061010
- 020505
- 000101
Tones
- 4F7B7C
- 557B7C
- 5B7C7D
- 607D7D
- 667D7E
- 6B7E7E
- 717E7F
- 767F7F
- 7B7F80
Farbharmonien
Komplementär +180°
- 487A7B
Lucky Shamrock
- 8D6364
≈ Grenache
Analog -30° +30°
- 487A7B
Lucky Shamrock
- 507A6A
≈ Wishard
- 4D7789
≈ Night Train
Triadisch +120° +240°
- 487A7B
Lucky Shamrock
- 7D6685
≈ Matriarch
- 826C4C
≈ Ermine
Geteilt komplementär +150° +210°
- 487A7B
Lucky Shamrock
- 886376
≈ Victorian Plum
- 8B6755
≈ Suede Leather
Tetradisch +90° +180° +270°
- 487A7B
Lucky Shamrock
- 6E6B8E
≈ Campanula Purple
- 8D6364
≈ Grenache
- 73734D
≈ Secret Meadow
Kontrast & Barrierefreiheit
Ag
AAAuf Weiß
WCAG 4.83:1 · APCA Lc 73
Ag
FailAuf Schwarz
WCAG 4.34:1 · APCA Lc 28
Beste Textfarbe: #FFFFFF
WCAG 4.83:1 (AA) · APCA Lc 73
Contrast pairs
Code-Snippets
CSS
:root {
--lucky-shamrock: #487a7b;
--lucky-shamrock-rgb: 72 122 123;
--lucky-shamrock-oklch: oklch(0.545 0.054 197.3);
}
.element {
color: var(--lucky-shamrock);
background-color: hsl(181 26% 38%);
border-color: oklch(0.545 0.054 197.3);
}Tailwind CSS v4
@theme {
--color-lucky-shamrock: #487a7b;
--color-lucky-shamrock-50: #e4fafb;
--color-lucky-shamrock-100: #d4eeef;
--color-lucky-shamrock-200: #badcdd;
--color-lucky-shamrock-300: #98c0c2;
--color-lucky-shamrock-400: #79a9aa;
--color-lucky-shamrock-500: #599293;
--color-lucky-shamrock-600: #4c7b7c;
--color-lucky-shamrock-700: #3d6363;
--color-lucky-shamrock-800: #2b4848;
--color-lucky-shamrock-900: #1d3232;
--color-lucky-shamrock-950: #0d1e1e;
}SCSS
$lucky-shamrock: #487a7b;
$lucky-shamrock-rgb: 72, 122, 123;
$lucky-shamrock-light: mix(#fff, $lucky-shamrock, 20%);
$lucky-shamrock-dark: mix(#000, $lucky-shamrock, 20%);
.element {
color: $lucky-shamrock;
box-shadow: 0 0 0 2px rgba($lucky-shamrock, 0.35);
}