CSS dark theme generator
Generate your custom dark theme with our easy-to-use CSS and SCSS Dark Theme Generator to easily create and manage your CSS and SCSS custom theme variables.
Tonal palettes
Primary tints
Best used for primary elements like buttons, links, and other primary elements.
#aca674
Primary - a0
#b5b083
Primary - a20
#bfb992
Primary - a40
#c8c3a1
Primary - a60
#d1cdb0
Primary - a80
#dad7bf
Primary - a100
Surface colors
Best used for surface elements like cards, backgrounds, and other surface elements.
#121212
Surface - a0
#282828
Surface - a20
#3f3f3f
Surface - a40
#575757
Surface - a60
#717171
Surface - a80
#8b8b8b
Surface - a100
Mixed surface colors
A mixed surface variant, best used for surface elements like cards, backgrounds, and other surface elements.
#201f1b
Mixed - a0
#353430
Mixed - a20
#4b4a46
Mixed - a40
#62615e
Mixed - a60
#7a7977
Mixed - a80
#939390
Mixed - a100
Tip: Press SPACE to generate a random primary color
Click a color block to copy to your clipboard.
Preview
Colorffy
Dashboard
Analytics
Users
Settings
Dashboard
Dark Theme
Card Surface #1
Far far away, behind the word mountains, far from the countries Vokalia and Consonantia, there live the blind texts.
Card Surface #2
Far far away, behind the word mountains, far from the countries Vokalia and Consonantia, there live the blind texts.
Card Surface #3
Far far away, behind the word mountains, far from the countries Vokalia and Consonantia, there live the blind texts.
Card Surface #4
Far far away, behind the word mountains, far from the countries Vokalia and Consonantia, there live the blind texts.
Card Surface #5
Far far away, behind the word mountains, far from the countries Vokalia and Consonantia, there live the blind texts.
Card Surface #6
Far far away, behind the word mountains, far from the countries Vokalia and Consonantia, there live the blind texts.
Card Surface #7
Far far away, behind the word mountains, far from the countries Vokalia and Consonantia, there live the blind texts.
Card Surface #8
Far far away, behind the word mountains, far from the countries Vokalia and Consonantia, there live the blind texts.
Card Surface #9
Far far away, behind the word mountains, far from the countries Vokalia and Consonantia, there live the blind texts.
Code
/** Dark theme primary colors */
--color-primary-a0: #aca674;
--color-primary-a10: #b5b083;
--color-primary-a20: #bfb992;
--color-primary-a30: #c8c3a1;
--color-primary-a40: #d1cdb0;
--color-primary-a50: #dad7bf;
/** Dark theme surface colors */
--color-surface-a0: #121212;
--color-surface-a10: #282828;
--color-surface-a20: #3f3f3f;
--color-surface-a30: #575757;
--color-surface-a40: #717171;
--color-surface-a50: #8b8b8b;
/** Dark theme mixed surface colors */
--color-surface-mixed-a0: #201f1b;
--color-surface-mixed-a10: #353430;
--color-surface-mixed-a20: #4b4a46;
--color-surface-mixed-a30: #62615e;
--color-surface-mixed-a40: #7a7977;
--color-surface-mixed-a50: #939390;
/** Examples */
.bg-primary {
color: var(--color-primary-a50);
background-color: var(--color-surface-a0);
}