色名 · #FED83A
Exploding Star
Exploding Starは#FED83A：rgb(254 216 58)、hsl(48 99% 61%)、oklch(0.889 0.167 94.6)。ティント、シェード、ハーモニー、WCAG/APCAコントラスト、CSS・Tailwind v4・SCSSコードを確認できます。
What does Yellow mean? → · Exploding Star color name →
#FED83A
oklch(0.889 0.167 94.6)
カラー変換
- HEX
- #fed83a
- RGB
- rgb(254 216 58)
- HSL
- hsl(48 99% 61%)
- HWB
- hwb(48 23% 0%)
- OKLCH
- oklch(0.889 0.167 94.6)
- OKLab
- oklab(0.889 -0.014 0.167)
- CIE Lab
- lab(87.74 2.77 76.49)
- LCH
- lch(87.74 76.54 87.9)
- CMYK
- cmyk(0% 15% 77% 0%)
ティント · シェード · トーン
ティント
- FEDC5A
- FEE172
- FEE587
- FEE99A
- FEEDAC
- FFF1BE
- FFF4CF
- FFF8DF
- FFFCEF
シェード
- DDBC31
- BDA028
- 9E8520
- 806B18
- 635310
- 473B09
- 2D2504
- 161101
- 030200
トーン
- F1CF4B
- E4C657
- D7BE60
- CAB568
- BDAC6E
- B0A373
- A49A77
- 98927B
- 8C897E
カラーハーモニー
補色 +180°
- FED83A
Exploding Star
- CFD9FF
≈ Icy Plains
類似色 -30° +30°
- FED83A
Exploding Star
- FFD1A5
≈ Affinity
- C2ED68
≈ Green Cow
トライアド +120° +240°
- FED83A
Exploding Star
- 93EAFF
≈ Alpine Expedition
- FFC6F2
≈ Rosy Maple Moth
スプリットコンプリメンタリー +150° +210°
- FED83A
Exploding Star
- BBE0FF
≈ Dithered Sky
- E4D0FF
≈ Pale Lavender
テトラード +90° +180° +270°
- FED83A
Exploding Star
- 00FBE7
≈ Bright Aqua
- CFD9FF
≈ Icy Plains
- FFCAD5
≈ Sweet Sixteen
コントラストとアクセシビリティ
Ag
Fail白の上
WCAG 1.39:1 · APCA Lc 19
Ag
AAA黒の上
WCAG 15.09:1 · APCA Lc 85
最適な文字色: #000000
WCAG 15.09:1 (AAA) · APCA Lc 85
Contrast pairs
コードスニペット
CSS
:root {
--exploding-star: #fed83a;
--exploding-star-rgb: 254 216 58;
--exploding-star-oklch: oklch(0.889 0.167 94.6);
}
.element {
color: var(--exploding-star);
background-color: hsl(48 99% 61%);
border-color: oklch(0.889 0.167 94.6);
}Tailwind CSS v4
@theme {
--color-exploding-star: #fed83a;
--color-exploding-star-50: #fff6bf;
--color-exploding-star-100: #f8e9a8;
--color-exploding-star-200: #e9d57f;
--color-exploding-star-300: #d0b745;
--color-exploding-star-400: #be9b00;
--color-exploding-star-500: #aa8100;
--color-exploding-star-600: #906d00;
--color-exploding-star-700: #735700;
--color-exploding-star-800: #573f00;
--color-exploding-star-900: #3d2b00;
--color-exploding-star-950: #261800;
}SCSS
$exploding-star: #fed83a;
$exploding-star-rgb: 254, 216, 58;
$exploding-star-light: mix(#fff, $exploding-star, 20%);
$exploding-star-dark: mix(#000, $exploding-star, 20%);
.element {
color: $exploding-star;
box-shadow: 0 0 0 2px rgba($exploding-star, 0.35);
}