色名 · #66FF55
Biopunk
Biopunkは#66FF55：rgb(102 255 85)、hsl(114 100% 67%)、oklch(0.885 0.246 141.7)。ティント、シェード、ハーモニー、WCAG/APCAコントラスト、CSS・Tailwind v4・SCSSコードを確認できます。
What does Green mean? → · Biopunk color name →
#66FF55
oklch(0.885 0.246 141.7)
カラー変換
- HEX
- #66ff55
- RGB
- rgb(102 255 85)
- HSL
- hsl(114 100% 67%)
- HWB
- hwb(114 33% 0%)
- OKLCH
- oklch(0.885 0.246 141.7)
- OKLab
- oklab(0.885 -0.193 0.153)
- CIE Lab
- lab(89.48 -65.11 65.2)
- LCH
- lch(89.48 92.14 135)
- CMYK
- cmyk(60% 0% 67% 0%)
ティント · シェード · トーン
ティント
- 7BFF6C
- 8EFF80
- 9FFF93
- AEFFA4
- BDFFB4
- CBFFC4
- D9FFD3
- E6FFE2
- F2FFF0
シェード
- 58DE49
- 4ABE3D
- 3C9E31
- 2F8026
- 23631C
- 174811
- 0C2E08
- 041602
- 000300
トーン
- 6DF25E
- 73E566
- 78D86C
- 7BCC71
- 7EBF75
- 7FB279
- 80A67B
- 81997D
- 818D7F
カラーハーモニー
補色 +180°
- 66FF55
Biopunk
- F7C5FF
≈ Aquarelle Lilac
類似色 -30° +30°
- 66FF55
Biopunk
- DEE400
≈ Peridot
- 00FDCB
≈ Plunge Pool
トライアド +120° +240°
- 66FF55
Biopunk
- C5DAFF
≈ Arc Light
- FFCAC7
≈ Tint of Rose
スプリットコンプリメンタリー +150° +210°
- 66FF55
Biopunk
- D9D3FF
≈ Pale Lavender
- FFC7DE
≈ Cherry Blush
テトラード +90° +180° +270°
コントラストとアクセシビリティ
Ag
Fail白の上
WCAG 1.31:1 · APCA Lc 15
Ag
AAA黒の上
WCAG 16.00:1 · APCA Lc 89
最適な文字色: #000000
WCAG 16.00:1 (AAA) · APCA Lc 89
Contrast pairs
コードスニペット
CSS
:root {
--biopunk: #66ff55;
--biopunk-rgb: 102 255 85;
--biopunk-oklch: oklch(0.885 0.246 141.7);
}
.element {
color: var(--biopunk);
background-color: hsl(114 100% 67%);
border-color: oklch(0.885 0.246 141.7);
}Tailwind CSS v4
@theme {
--color-biopunk: #66ff55;
--color-biopunk-50: #cbffc8;
--color-biopunk-100: #b5feb3;
--color-biopunk-200: #8fef8e;
--color-biopunk-300: #5ad65c;
--color-biopunk-400: #20bf00;
--color-biopunk-500: #00a900;
--color-biopunk-600: #008f00;
--color-biopunk-700: #007200;
--color-biopunk-800: #005400;
--color-biopunk-900: #003b00;
--color-biopunk-950: #002400;
}SCSS
$biopunk: #66ff55;
$biopunk-rgb: 102, 255, 85;
$biopunk-light: mix(#fff, $biopunk, 20%);
$biopunk-dark: mix(#000, $biopunk, 20%);
.element {
color: $biopunk;
box-shadow: 0 0 0 2px rgba($biopunk, 0.35);
}