Teal Color
Back to top

Teal Color Palette Documentation

  1. Home
  2. Color Palette
  3. Teal

Teal

Teal Color Palette with color code and other elements.

Teal Background Color
Background Color Options Class Description
Background Color .bg-teal Teal Class for background color.
Lighten Color .bg-teal.bg-lighten-* For lighten teal background color, this two classes needed. Here *: 1,2,3,4 lighten teal color options.
Darken Color .bg-teal.bg-darken-* For darken teal background color, this two classes needed. Here *: 1,2,3,4 darken teal color options.
Accent Color .bg-teal.bg-accent-* For accent teal background color, this two classes needed. Here *: 1,2,3,4 accent teal color options.

Teal Border Color

Border Color Options Class Description
Border Color .border-teal Teal Class for background color.
Lighten Border .border-teal
.border-lighten-*		 For lighten teal background color, this two classes needed. Here *: 1,2,3,4 lighten teal color options.
Lighten Top Border .border-top-teal
.border-top-lighten-*		 For lighten teal top border. Use this classes if you need to highlight only top border.
Lighten Bottom Border .
.border-bottom-lighten-*		 For lighten teal bottom border. Use this classes if you need to highlight only bottom border.
Lighten Right Border .border-right-teal
.border-right-lighten-*		 For lighten teal right border. Use this classes if you need to highlight only right border.
Lighten Left Border .border-left-teal
.border-left-lighten-*		 For lighten teal left border. Use this classes if you need to highlight only left border.
Darken Border .border-teal
.border-darken-*		 For darken teal background color, this two classes needed. Here *: 1,2,3,4 darken teal color options.
Darken Top Border .border-top-teal
.border-top-darken-*		 For darken teal top border. Use this classes if you need to highlight only top border.
Darken Bottom Border .
.border-bottom-darken-*		 For darken teal bottom border. Use this classes if you need to highlight only bottom border.
Darken Right Border .border-right-teal
.border-right-darken-*		 For darken teal right border. Use this classes if you need to highlight only right border.
Darken Left Border .border-left-teal
.border-left-darken-*		 For darken teal left border. Use this classes if you need to highlight only left border.
Accent Border .border-teal
.border-accent-*		 For accent teal background color, this two classes needed. Here *: 1,2,3,4 accent teal color options.
Accent Top Border .border-top-teal
.border-top-accent-*		 For accent teal top border. Use this classes if you need to highlight only top border.
Accent Bottom Border .
.border-bottom-accent-*		 For accent teal bottom border. Use this classes if you need to highlight only bottom border.
Accent Right Border .border-right-teal
.border-right-accent-*		 For accent teal right border. Use this classes if you need to highlight only right border.
Accent Left Border .border-left-teal
.border-left-accent-*		 For accent teal left border. Use this classes if you need to highlight only left border.

Teal Text Color

Border Color Options Class Description
Text Color .teal Class for Teal Text color.
Lighten Color .teal.lighten-* For lighten teal text color, this two classes needed. Here *: 1,2,3,4 for lighten teal color options.
Darken Color .teal.darken-* For darken teal text color, this two classes needed. Here *: 1,2,3,4 for darken teal color options.
Accent Color .teal.accent-* For accent teal text color, this two classes needed. Here *: 1,2,3,4 for accent teal color options.

Reference :

Type URL
Classic Teal https://demos.pixinvent.com/modern-html-admin-template/html/ltr/vertical-menu-template/color-palette-teal.html
Material Teal https://demos.pixinvent.com/modern-html-admin-template/html/ltr/material-vertical-menu-template/color-palette-teal.html