色名 · #FDDDE6
Fresh Piglet
Fresh Pigletは#FDDDE6：rgb(253 221 230)、hsl(343 89% 93%)、oklch(0.926 0.037 359)。ティント、シェード、ハーモニー、WCAG/APCAコントラスト、CSS・Tailwind v4・SCSSコードを確認できます。
What does Pink mean? → · Fresh Piglet color name →
#FDDDE6
oklch(0.926 0.037 359)
カラー変換
- HEX
- #fddde6
- RGB
- rgb(253 221 230)
- HSL
- hsl(343 89% 93%)
- HWB
- hwb(343 87% 1%)
- OKLCH
- oklch(0.926 0.037 359)
- OKLab
- oklab(0.926 0.037 -0.001)
- CIE Lab
- lab(91 12.49 -0.13)
- LCH
- lch(91 12.5 359.4)
- CMYK
- cmyk(0% 13% 9% 1%)
ティント · シェード · トーン
ティント
- FDE0E8
- FEE4EB
- FEE7ED
- FEEBF0
- FEEEF2
- FFF1F5
- FFF5F7
- FFF8FA
- FFFCFC
シェード
- DCC0C8
- BCA4AB
- 9D888E
- 7F6E73
- 625559
- 473D40
- 2D2628
- 161113
- 030203
トーン
- F0D3DB
- E3CAD1
- D6C0C6
- C9B7BC
- BDADB2
- B0A4A7
- A49B9D
- 989293
- 8C898A
カラーハーモニー
補色 +180°
- FDDDE6
Fresh Piglet
- CDEFE7
≈ Underwater
類似色 -30° +30°
- FDDDE6
Fresh Piglet
- F5DEF3
≈ Grape Taffy
- FFDED9
≈ Peachy Keen
トライアド +120° +240°
- FDDDE6
Fresh Piglet
- E4EBCF
≈ Misted Fern
- D1EBFD
≈ Veiling Waterfalls
スプリットコンプリメンタリー +150° +210°
- FDDDE6
Fresh Piglet
- D6EED9
≈ Garden Shed
- CBEEF4
≈ Diamond League
テトラード +90° +180° +270°
- FDDDE6
Fresh Piglet
- F1E6CB
≈ Distressed White
- CDEFE7
≈ Underwater
- DDE6FF
≈ Lavender Mist
コントラストとアクセシビリティ
Ag
Fail白の上
WCAG 1.26:1 · APCA Lc 13
Ag
AAA黒の上
WCAG 16.66:1 · APCA Lc 91
最適な文字色: #000000
WCAG 16.66:1 (AAA) · APCA Lc 91
Contrast pairs
コードスニペット
CSS
:root {
--fresh-piglet: #fddde6;
--fresh-piglet-rgb: 253 221 230;
--fresh-piglet-oklch: oklch(0.926 0.037 359);
}
.element {
color: var(--fresh-piglet);
background-color: hsl(343 89% 93%);
border-color: oklch(0.926 0.037 359);
}Tailwind CSS v4
@theme {
--color-fresh-piglet: #fddde6;
--color-fresh-piglet-50: #fff1f4;
--color-fresh-piglet-100: #f3e3e7;
--color-fresh-piglet-200: #e3ced3;
--color-fresh-piglet-300: #c9b0b6;
--color-fresh-piglet-400: #b2969e;
--color-fresh-piglet-500: #9c7c85;
--color-fresh-piglet-600: #846971;
--color-fresh-piglet-700: #69545a;
--color-fresh-piglet-800: #4d3d42;
--color-fresh-piglet-900: #362a2e;
--color-fresh-piglet-950: #21181b;
}SCSS
$fresh-piglet: #fddde6;
$fresh-piglet-rgb: 253, 221, 230;
$fresh-piglet-light: mix(#fff, $fresh-piglet, 20%);
$fresh-piglet-dark: mix(#000, $fresh-piglet, 20%);
.element {
color: $fresh-piglet;
box-shadow: 0 0 0 2px rgba($fresh-piglet, 0.35);
}