色名 · #00FF33
Lucent Lime
Lucent Limeは#00FF33：rgb(0 255 51)、hsl(132 100% 50%)、oklch(0.868 0.284 143.7)。ティント、シェード、ハーモニー、WCAG/APCAコントラスト、CSS・Tailwind v4・SCSSコードを確認できます。
What does Green mean? → · Lucent Lime color name →
#00FF33
oklch(0.868 0.284 143.7)
カラー変換
- HEX
- #00ff33
- RGB
- rgb(0 255 51)
- HSL
- hsl(132 100% 50%)
- HWB
- hwb(132 0% 0%)
- OKLCH
- oklch(0.868 0.284 143.7)
- OKLab
- oklab(0.868 -0.229 0.168)
- CIE Lab
- lab(87.92 -78.18 73.78)
- LCH
- lch(87.92 107.5 136.7)
- CMYK
- cmyk(100% 0% 80% 0%)
ティント · シェード · トーン
ティント
- 4CFF56
- 6CFF6F
- 85FF85
- 9AFF99
- AEFFAB
- BFFFBD
- D0FFCE
- E0FFDF
- F0FFEF
シェード
- 00DE2B
- 00BE23
- 009E1C
- 008014
- 00630D
- 004807
- 002E03
- 001601
- 000300
トーン
- 38F246
- 4DE653
- 5BD95E
- 66CC66
- 6DC06C
- 74B372
- 78A677
- 7C9A7A
- 7E8D7D
カラーハーモニー
補色 +180°
- 00FF33
Lucent Lime
- F9BAFF
≈ Brilliant Lavender
類似色 -30° +30°
- 00FF33
Lucent Lime
- D4E000
≈ Pear
- 00F6CB
≈ Bright Teal
トライアド +120° +240°
- 00FF33
Lucent Lime
- BED4FF
≈ Pale Phthalo Blue
- FFC2BD
≈ Ladylike
スプリットコンプリメンタリー +150° +210°
- 00FF33
Lucent Lime
- D5CBFF
≈ Lavender Blue
- FFBED7
≈ Cotton Candy
テトラード +90° +180° +270°
- 00FF33
Lucent Lime
- A1DDFF
≈ Columbia Blue
- F9BAFF
≈ Brilliant Lavender
- FFC6A1
≈ Apricot Froth
コントラストとアクセシビリティ
Ag
Fail白の上
WCAG 1.36:1 · APCA Lc 17
Ag
AAA黒の上
WCAG 15.35:1 · APCA Lc 87
最適な文字色: #000000
WCAG 15.35:1 (AAA) · APCA Lc 87
Contrast pairs
コードスニペット
CSS
:root {
--lucent-lime: #00ff33;
--lucent-lime-rgb: 0 255 51;
--lucent-lime-oklch: oklch(0.868 0.284 143.7);
}
.element {
color: var(--lucent-lime);
background-color: hsl(132 100% 50%);
border-color: oklch(0.868 0.284 143.7);
}Tailwind CSS v4
@theme {
--color-lucent-lime: #00ff33;
--color-lucent-lime-50: #c0ffc4;
--color-lucent-lime-100: #a8ffad;
--color-lucent-lime-200: #7af486;
--color-lucent-lime-300: #2bdb50;
--color-lucent-lime-400: #00c400;
--color-lucent-lime-500: #00ae00;
--color-lucent-lime-600: #009300;
--color-lucent-lime-700: #007600;
--color-lucent-lime-800: #005700;
--color-lucent-lime-900: #003d00;
--color-lucent-lime-950: #002600;
}SCSS
$lucent-lime: #00ff33;
$lucent-lime-rgb: 0, 255, 51;
$lucent-lime-light: mix(#fff, $lucent-lime, 20%);
$lucent-lime-dark: mix(#000, $lucent-lime, 20%);
.element {
color: $lucent-lime;
box-shadow: 0 0 0 2px rgba($lucent-lime, 0.35);
}