Theme Settings

Penguin UI makes styling easy. You can customize how components look before using them. Choose from different themes or create your own color scheme. You can also pick fonts and adjust border settings to suit your design preferences.


You need to add these fonts before using them.


Border Radius

Light Mode Colors

Main background color

Text on main background color

Strong text on main background color

Alternate background color

Accent color for light mode

Text on primary color

Secondary accent color for light mode

Text on secondary color

Outline Color

Strong outline color

Shared Colors

These colors are shared across dark and light modes

Danger or error color

Text on danger color

Informational color

Text on informational color

Warning color

Text on warning color

Success color

Text on success color

Color Contrast Checker

Select a color to check its contrast with the rest of the colors in the current theme.


🍪 Got Cookies!

We use cookies to ensure that we give you the best experience on our website. For more information, please read our Privacy Policy .