色名 · #DDFF00
Lime Zest
Lime Zestは#DDFF00：rgb(221 255 0)、hsl(68 100% 50%)、oklch(0.942 0.222 119)。ティント、シェード、ハーモニー、WCAG/APCAコントラスト、CSS・Tailwind v4・SCSSコードを確認できます。
What does Yellow mean? → · Lime Zest color name →
#DDFF00
oklch(0.942 0.222 119)
カラー変換
- HEX
- #ddff00
- RGB
- rgb(221 255 0)
- HSL
- hsl(68 100% 50%)
- HWB
- hwb(68 0% 0%)
- OKLCH
- oklch(0.942 0.222 119)
- OKLab
- oklab(0.942 -0.108 0.194)
- CIE Lab
- lab(95.07 -29.27 90.21)
- LCH
- lch(95.07 94.85 108)
- CMYK
- cmyk(13% 0% 100% 0%)
ティント · シェード · トーン
ティント
- E0FF49
- E3FF69
- E6FF82
- EAFF97
- EDFFAB
- F0FFBD
- F4FFCE
- F8FFDF
- FBFFEF
シェード
- C0DE00
- A4BE00
- 889E00
- 6E8000
- 556300
- 3D4800
- 262E00
- 111600
- 020300
トーン
- D3F236
- C9E54A
- C0D858
- B6CB63
- ADBF6B
- A3B271
- 9AA676
- 91997B
- 898D7E
カラーハーモニー
補色 +180°
- DDFF00
Lime Zest
- EEE8FF
≈ Bright Dusk
類似色 -30° +30°
- DDFF00
Lime Zest
- FFEAB6
≈ Solar
- BEFFC8
≈ Coastal Trim
トライアド +120° +240°
- DDFF00
Lime Zest
- DAEFFF
≈ Calcareous Sinter
- FFE4EB
≈ Early Blossom
スプリットコンプリメンタリー +150° +210°
- DDFF00
Lime Zest
- E4ECFF
≈ Brilliant White
- FFE1FC
≈ Fairy Salt
テトラード +90° +180° +270°
- DDFF00
Lime Zest
- C4F6FF
≈ Pale Sky
- EEE8FF
≈ Bright Dusk
- FFE5E1
≈ Olm Pink
コントラストとアクセシビリティ
Ag
Fail白の上
WCAG 1.14:1 · APCA Lc 0
Ag
AAA黒の上
WCAG 18.37:1 · APCA Lc 98
最適な文字色: #000000
WCAG 18.37:1 (AAA) · APCA Lc 98
Contrast pairs
コードスニペット
CSS
:root {
--lime-zest: #ddff00;
--lime-zest-rgb: 221 255 0;
--lime-zest-oklch: oklch(0.942 0.222 119);
}
.element {
color: var(--lime-zest);
background-color: hsl(68 100% 50%);
border-color: oklch(0.942 0.222 119);
}Tailwind CSS v4
@theme {
--color-lime-zest: #ddff00;
--color-lime-zest-50: #ebffb8;
--color-lime-zest-100: #ddf49f;
--color-lime-zest-200: #c6e371;
--color-lime-zest-300: #a7c725;
--color-lime-zest-400: #92ae00;
--color-lime-zest-500: #7a9500;
--color-lime-zest-600: #677f00;
--color-lime-zest-700: #526500;
--color-lime-zest-800: #3f4a00;
--color-lime-zest-900: #2b3300;
--color-lime-zest-950: #191e00;
}SCSS
$lime-zest: #ddff00;
$lime-zest-rgb: 221, 255, 0;
$lime-zest-light: mix(#fff, $lime-zest, 20%);
$lime-zest-dark: mix(#000, $lime-zest, 20%);
.element {
color: $lime-zest;
box-shadow: 0 0 0 2px rgba($lime-zest, 0.35);
}