Discussion on Assan - Multipurpose Theme + Admin + UI Kit

Hi Vonhaupt

Adding new color system took less than 1 minute if you're using npm & sass

Simply open /scss/custom/variables/_variables.scss file

Jump to line no 300 and you will found commented line below

// scss-docs-start theme-color-variables

Add your new color below like this:

// scss-docs-start theme-color-variables

$teal: #028f76!default; //New color
$primary: $indigo !default;
$secondary: $gray-500 !default;
$success: $green !default;
$info: $blue !default;
$warning: $yellow !default;
$danger: $red !default;
$light: $gray-100 !default;
$white: $white !default;
$dark: $gray-900 !default;
also add this new color to theme-colors

// scss-docs-start theme-colors-map
$theme-colors: (
"teal": $teal, //New color
"primary": $primary,
"secondary": $secondary,
"success": $success,
"info": $info,
"warning": $warning,
"danger": $danger,
"light": $light,
"white": $white,
"dark": $dark
) !default;

uses by class name:

button - btn btn-teal
text - text-teal
bg - bg-teal
light-bg - bg-teal bg-opacity-10 (is going to update into next update with bootstrap 5.3)

Note: Above teal color is an example of adding new color system, You can use color name and code of your choice!

Assan new update v5 is coming with default bootstrap 5.3 dark mode, Stay tuned

Best Regards!
Rakesh