Gradient Page

#49A09D

#49A09D is the HEX color code for
Hippie Blue
#49A09D

Hippie Blue

Contrast
Light
Luminance
52%
Color Conversions
Formats for Hippie Blue (#49A09D) in various color spaces.
#49A09D
73, 160, 157
178°, 37%, 46%
54%, 0%, 2%, 37%
0.652, 0.084, 192.2
--color-hippie-blue: #49A09D;

Shades & Tints

#eef7f7
#cbe7e6
#a8d7d5
#85c7c5
#62b7b4
#489d9a
#387a78
#285756
#183433
#081111
DarkestBaseLightest

Color Harmonies

Complementary

#49A09D
#a14a4d

Analogous

#4aa172
#49A09D
#4a78a1

Triadic

#49A09D
#9e4aa1
#a19e4a

Split Complementary

#49A09D
#a14a78
#a1724a

UI Component Examples

See how #49A09D looks when applied to real interface components.

Interactive Elements
Surface & Accent
Pro Tip!

Use lighter tints for backgrounds to maintain readability while keeping brand identity.

Status Indicator
Active
# CSS Variables
Copy-paste these variables into your global CSS to use this palette instantly.
:root {
  /* Hippie Blue Base */
  --color-primary: #49A09D;
  --color-primary-rgb: 73 160 157;
  --color-primary-hsl: 178 37% 46%;
  
  /* Foreground text color based on contrast */
  --color-primary-foreground: #000000;

  /* Shades */
  --color-primary-50:  #eef7f7;
  --color-primary-100: #cbe7e6;
  --color-primary-200: #a8d7d5;
  --color-primary-300: #85c7c5;
  --color-primary-400: #62b7b4;
  --color-primary-500: #489d9a;
  --color-primary-600: #387a78;
  --color-primary-700: #285756;
  --color-primary-800: #183433;
  --color-primary-900: #081111;
}

Want more?

We hope you enjoyed this color. Keep reading for more amazing colorful content for developers, designers and creators!
View our entire collection of UI gradientsView all our color names
#49A09D Hex Color | Hippie Blue sl | UI Color Scheme Generator