Theming

You can apply your own theme to the kotti design system.
Since we are defining the theme tokens with CSS custom properties, they can easily be overwriten.

However, if done on a dedicated stylesheet, it would have to be imported after importing Kotti

priority by precedence of loading stylesheets

Example:

.kt-navbar {
	--primary-70: red;
}

A simpler approach is to overwrite the root element style:

:root {
	--primary-70: red;
}

Demo

Overwrite the Primary Color:

E.g. Used for buttons and Navbar background