Benoemde kleur · #B2CFBE
Gossamer Green
Gossamer Green is #B2CFBE: rgb(178 207 190), hsl(145 23% 75%), oklch(0.828 0.039 159.7). Bekijk tinten, schaduwen, harmonieën, WCAG- en APCA-contrast en CSS-, Tailwind v4- en SCSS-code.
What does Green mean? → · Gossamer Green color name →
#B2CFBE
oklch(0.828 0.039 159.7)
Kleurconversies
- HEX
- #b2cfbe
- RGB
- rgb(178 207 190)
- HSL
- hsl(145 23% 75%)
- HWB
- hwb(145 70% 19%)
- OKLCH
- oklch(0.828 0.039 159.7)
- OKLab
- oklab(0.828 -0.037 0.014)
- CIE Lab
- lab(80.6 -12.54 5.05)
- LCH
- lch(80.6 13.52 158)
- CMYK
- cmyk(14% 0% 8% 19%)
Tinten · Schaduwen · Tonen
Tinten
- BAD4C4
- C1D9CB
- C9DDD1
- D1E2D8
- D8E7DE
- E0ECE5
- E8F0EB
- EFF5F2
- F7FAF8
Schaduwen
- 9AB4A5
- 83998C
- 6D7F75
- 57675E
- 434F48
- 2F3833
- 1D231F
- 0C100D
- 010202
Tonen
- ADC7B8
- A8BFB1
- A3B7AB
- 9EAFA5
- 99A79E
- 949F98
- 8F9792
- 8A8F8C
- 858886
Kleurharmonieën
Complementair +180°
- B2CFBE
Gossamer Green
- D9BDCF
≈ Pale Petals
Analoog -30° +30°
- B2CFBE
Gossamer Green
- BFCCB2
≈ Soft Froth
- ABCFCC
≈ Blue Angora
Triadisch +120° +240°
- B2CFBE
Gossamer Green
- C1C5E0
≈ Violet Scent Soft Blue
- DEBFB4
≈ Peach Blush
Gesplitst complementair +150° +210°
- B2CFBE
Gossamer Green
- CEC0DA
≈ Awesome Aura
- DFBDC1
≈ Crystalline Pink
Tetradisch +90° +180° +270°
- B2CFBE
Gossamer Green
- B4C9E0
≈ Wind Blue
- D9BDCF
≈ Pale Petals
- D8C3AC
≈ Vanilla Iced Coffee
Contrast en toegankelijkheid
Ag
FailOp wit
WCAG 1.67:1 · APCA Lc 29
Ag
AAAOp zwart
WCAG 12.56:1 · APCA Lc 73
Beste tekstkleur: #000000
WCAG 12.56:1 (AAA) · APCA Lc 73
Contrast pairs
Codefragmenten
CSS
:root {
--gossamer-green: #b2cfbe;
--gossamer-green-rgb: 178 207 190;
--gossamer-green-oklch: oklch(0.828 0.039 159.7);
}
.element {
color: var(--gossamer-green);
background-color: hsl(145 23% 75%);
border-color: oklch(0.828 0.039 159.7);
}Tailwind CSS v4
@theme {
--color-gossamer-green: #b2cfbe;
--color-gossamer-green-50: #ecf9f2;
--color-gossamer-green-100: #ddece4;
--color-gossamer-green-200: #c6dacf;
--color-gossamer-green-300: #a7beb1;
--color-gossamer-green-400: #8ba696;
--color-gossamer-green-500: #708e7d;
--color-gossamer-green-600: #5f796a;
--color-gossamer-green-700: #4c6055;
--color-gossamer-green-800: #37473d;
--color-gossamer-green-900: #26312a;
--color-gossamer-green-950: #141d18;
}SCSS
$gossamer-green: #b2cfbe;
$gossamer-green-rgb: 178, 207, 190;
$gossamer-green-light: mix(#fff, $gossamer-green, 20%);
$gossamer-green-dark: mix(#000, $gossamer-green, 20%);
.element {
color: $gossamer-green;
box-shadow: 0 0 0 2px rgba($gossamer-green, 0.35);
}