色名 · #EEFF00

Zeus’s Bolt

Zeus’s Boltは#EEFF00：rgb(238 255 0)、hsl(64 100% 50%)、oklch(0.955 0.216 114.6)。ティント、シェード、ハーモニー、WCAG/APCAコントラスト、CSS・Tailwind v4・SCSSコードを確認できます。

What does Yellow mean? → · Zeus’s Bolt color name →

#EEFF00

oklch(0.955 0.216 114.6)

カラー変換

HEX: #eeff00
RGB: rgb(238 255 0)
HSL: hsl(64 100% 50%)
HWB: hwb(64 0% 0%)
OKLCH: oklch(0.955 0.216 114.6)
OKLab: oklab(0.955 -0.09 0.196)
CIE Lab: lab(96.29 -22.57 91.75)
LCH: lch(96.29 94.49 103.8)
CMYK: cmyk(7% 0% 100% 0%)

ティント · シェード · トーン

ティント

EFFF4A
F1FF6A
F2FF83
F4FF98
F5FFAB
F7FFBD
F9FFCF
FBFFDF
FDFFEF

シェード

CFDE00
B1BE00
939E00
778000
5C6300
424800
2A2E00
141600
030300

トーン

E2F236
D7E54B
CBD859
C0CB64
B5BF6C
AAB272
9FA577
94997B
8A8C7E

カラーハーモニー

補色 +180°

EEFF00
Zeus’s Bolt
F1EDFF
≈ Foundation White

類似色 -30° +30°

トライアド +120° +240°

スプリットコンプリメンタリー +150° +210°

テトラード +90° +180° +270°

コントラストとアクセシビリティ

白の上

WCAG 1.10:1 · APCA Lc 0

Fail

黒の上

WCAG 18.93:1 · APCA Lc 100

AAA

最適な文字色: #000000

WCAG 18.93:1 (AAA) · APCA Lc 100

Contrast pairs

コードスニペット

CSS

:root {
  --zeus-s-bolt: #eeff00;
  --zeus-s-bolt-rgb: 238 255 0;
  --zeus-s-bolt-oklch: oklch(0.955 0.216 114.6);
}

.element {
  color: var(--zeus-s-bolt);
  background-color: hsl(64 100% 50%);
  border-color: oklch(0.955 0.216 114.6);
}

Tailwind CSS v4

@theme {
  --color-zeus-s-bolt: #eeff00;
  --color-zeus-s-bolt-50: #f1feb7;
  --color-zeus-s-bolt-100: #e3f29e;
  --color-zeus-s-bolt-200: #cfe06e;
  --color-zeus-s-bolt-300: #b1c41e;
  --color-zeus-s-bolt-400: #9eaa00;
  --color-zeus-s-bolt-500: #879100;
  --color-zeus-s-bolt-600: #727b00;
  --color-zeus-s-bolt-700: #5b6300;
  --color-zeus-s-bolt-800: #454700;
  --color-zeus-s-bolt-900: #303100;
  --color-zeus-s-bolt-950: #1c1d00;
}

SCSS

$zeus-s-bolt: #eeff00;
$zeus-s-bolt-rgb: 238, 255, 0;
$zeus-s-bolt-light: mix(#fff, $zeus-s-bolt, 20%);
$zeus-s-bolt-dark: mix(#000, $zeus-s-bolt, 20%);

.element {
  color: $zeus-s-bolt;
  box-shadow: 0 0 0 2px rgba($zeus-s-bolt, 0.35);
}

近い色名

ツールで開く

ピッカーペアコントラストチェッカー Studio JSON API