Skip to main content

Available themes

Koval UI ships with three themes bundled: Podil, Dnipro and Dovzhenko.

Storybook

You can see and try all available themes at Koval Storybook. There is also a dedicated theme color palette story.

Apply theme​

import type {FC} from 'react';
import {Provider, themeDnipro, themePodil, themeDovzhenko} from 'koval-ui';

export const App: FC = () => {
  // Theme Podil is set by default.
  return <Provider theme={themeDnipro}>{/*App code*/}</Provider>;
};

Podil​

Default theme. Named after my favorite Kiev district.

Example​

Table with theme applied.

Dnipro​

Complementary theme to Podil. Has brand and accent colors swapped.

Example​

Table with theme applied.

Dovzhenko​

Black and white theme which may be useful for UX testing purposes. Named after Alexander Dovzhenko, a famous movie director.

Example​

Table with theme applied.