Success Color Palette Documentation

Success

Success Color Palette with color code and other elements.

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

Success Border Color

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

Success Text Color

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

Reference :

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