website/assets/scss/variables.scss

:root {
	--background: hsl(210, 21%, 15%);
	--border: hsl(210, 21%, 20%);
	
	--text: hsl(210, 21%, 95%);
	--text-2: hsl(210, 21%, 80%);
	--text-secondary: hsl(210, 21%, 40%);
	
	--sidebar-background: hsl(210, 21%, 10%);

	--vriish-rose: hsl(0, 100%, 75%);
	--orange: hsl(25, 100%, 75%);
	--gold: hsl(50, 100%, 75%);
	--emerald: hsl(130, 100%, 75%);
	--sky: hsl(215, 100%, 75%);
	--purpur: hsl(275, 100%, 75%);
	--white: hsl(360, 100%, 100%);

	--vriish-gradient: linear-gradient(30deg, var(--orange) -100%, var(--vriish-rose) 100%);
	--vriish-gradient-shadow: 2px 2px 10px var(--background);
}
@media (prefers-color-scheme: light) {
	:root {
		--background: hsl(0, 100%, 95%);
		--border: hsl(0, 100%, 90%);

		--text: hsl(0, 20%, 20%);
		--text-2: hsl(0, 20%, 30%);
		--text-secondary: hsl(0, 20%, 70%);

		--sidebar-background: hsl(0, 100%, 95%);
	}
}