kolory z https://reindeere.ca/#content, https://tachyons.io, fajne komponenty https://daisyui.com/docs/install

kolorki.css

:root {
 color-scheme:dark light;
 --background-light: #fafdfb;
 --on-background-light: #191c1c;
 --surface-light: #eef1ef;
 --on-surface-light: #191c1c;
 --surface-variant-light: #f1e0d0;
 --on-surface-variant-light: #504539;
 --primary-light: #865300;
 --on-primary-light: #ffffff;
 --primary-container-light: #ffddb5;
 --on-primary-container-light: #2b1700;
 --secondary-light: #a23c42;
 --on-secondary-light: #ffffff;
 --secondary-container-light: #ffd9da;
 --on-secondary-container-light: #410008;
 --tertiary-light: #00639b;
 --on-tertiary-light: #ffffff;
 --tertiary-container-light: #cbe5ff;
 --on-tertiary-container-light: #001d32;
 --error-light: #ba1b1b;
 --error-container-light: #ffdad4;
 --on-error-light: #ffffff;
 --on-error-container-light: #410001;
 --outline-light: #827568;
 --background-dark: #191c1c;
 --on-background-dark: #e0e3e1;
 --surface-dark: #232726;
 --on-surface-dark: #e0e3e1;
 --surface-variant-dark: #504539;
 --on-surface-variant-dark: #d4c4b5;
 --primary-dark: #ffb95a;
 --on-primary-dark: #482a00;
 --primary-container-dark: #663e00;
 --on-primary-container-dark: #ffddb5;
 --secondary-dark: #ffb3b5;
 --on-secondary-dark: #640b18;
 --secondary-container-dark: #82242c;
 --on-secondary-container-dark: #ffd9da;
 --tertiary-dark: #92ccff;
 --on-tertiary-dark: #003353;
 --tertiary-container-dark: #004a75;
 --on-tertiary-container-dark: #cbe5ff;
 --error-dark: #ffb4a9;
 --error-container-dark: #930006;
 --on-error-dark: #680003;
 --on-error-container-dark: #ffdad4;
 --outline-dark: #9c8e80;
 --background: var(--background-light);
 --on-background: var(--on-background-light);
 --surface: var(--surface-light);
 --on-surface: var(--on-surface-light);
 --surface-variant: var(--surface-variant-light);
 --on-surface-variant: var(--on-surface-variant-light);
 --primary: var(--primary-light);
 --on-primary: var(--on-primary-light);
 --primary-container: var(--primary-container-light);
 --on-primary-container: var(--on-primary-container-light);
 --secondary: var(--secondary-light);
 --on-secondary: var(--on-secondary-light);
 --secondary-container: var(--secondary-container-light);
 --on-secondary-container: var(--on-secondary-container-light);
 --tertiary: var(--tertiary-light);
 --on-tertiary: var(--on-tertiary-light);
 --tertiary-container: var(--tertiary-container-light);
 --on-tertiary-container: var(--on-tertiary-container-light);
 --error: var(--error-light);
 --error-container: var(--error-container-light);
 --on-error: var(--on-error-light);
 --on-error-container: var(--on-error-container-light);
 --outline: var(--outline-light)
}
@media (prefers-color-scheme: dark) {
 :root {
  --background: var(--background-dark);
  --on-background: var(--on-background-dark);
  --surface: var(--surface-dark);
  --on-surface: var(--on-surface-dark);
  --surface-variant: var(--surface-variant-dark);
  --on-surface-variant: var(--on-surface-variant-dark);
  --primary: var(--primary-dark);
  --on-primary: var(--on-primary-dark);
  --primary-container: var(--primary-container-dark);
  --on-primary-container: var(--on-primary-container-dark);
  --secondary: var(--secondary-dark);
  --on-secondary: var(--on-secondary-dark);
  --secondary-container: var(--secondary-container-dark);
  --on-secondary-container: var(--on-secondary-container-dark);
  --tertiary: var(--tertiary-dark);
  --on-tertiary: var(--on-tertiary-dark);
  --tertiary-container: var(--tertiary-container-dark);
  --on-tertiary-container: var(--on-tertiary-container-dark);
  --error: var(--error-dark);
  --error-container: var(--error-container-dark);
  --on-error: var(--on-error-dark);
  --on-error-container: var(--on-error-container-dark);
  --outline: var(--outline-dark)
 }
}

tachyons.io.css

Aa	--dark-red: #e7040f;
	Aa	--red: #ff4136;
	Aa	--light-red: #ff725c;
	Aa	--orange: #ff6300;
	Aa	--gold: #ffb700;
	Aa	--yellow: #ffde37;
	Aa	--light-yellow: #fbf1a9;
	Aa	--purple: #5e2ca5;
	Aa	--light-purple: #a463f2;
	Aa	--dark-pink: #d5008f;
	Aa	--hot-pink: #ff41b4;
	Aa	--pink: #ff80cc;
	Aa	--light-pink: #ffa3d7;
	Aa	--dark-green: #137752;
	Aa	--green: #19a974;
	Aa	--light-green: #9eebcf;
	Aa	--navy: #001b44;
	Aa	--dark-blue: #00449e;
	Aa	--blue: #357edd;
	Aa	--light-blue: #96ccff;
	Aa	--lightest-blue: #cdecff;
	Aa	--washed-blue: #f6fffe;
	Aa	--washed-green: #e8fdf5;
	Aa	--washed-yellow: #fffceb;
	Aa	--washed-red: #ffdfdf;