Kitn Logo

Theme Editor

Base Colors

Text
Primary
Primary
Primary Hover
Primary Active
Primary Foreground
Disabled
Text
Secondary
Secondary
Secondary Hover
Secondary Active
Secondary Foreground
Disabled
Text
Accent
Accent
Accent Hover
Accent Active
Accent Foreground
Disabled

Status Colors

Text
Success
Success
Success Hover
Success Active
Success Foreground
Disabled
Text
Warning
Warning
Warning Hover
Warning Active
Warning Foreground
Disabled
Text
Error
Error
Error Hover
Error Active
Error Foreground
Disabled
Text
Info
Info
Info Hover
Info Active
Info Foreground
Disabled

Utility Colors

Base Theme
Background & Text
Copy
Surface & Text
Copy
Border Light
Copy
Border Strong
Copy
Disabled State
Copy
Inverse Theme
Background & Text Inverse
Copy
Surface Dark & Text Inverse
Copy
Border Light
Copy
Border Strong
Copy
Disabled State
Copy

Surface & Card Examples

Neutral
Surface 50
Copy
Surface 100
Copy
Surface 200
Copy
Primary
Primary 50
Copy
Primary 100
Copy
Primary 200
Copy
Secondary
Secondary 50
Copy
Secondary 100
Copy
Secondary 200
Copy
Accent
Accent 50
Copy
Accent 100
Copy
Accent 200
Copy
Success
Success 50
Copy
Success 100
Copy
Success 200
Copy
Warning
Warning 50
Copy
Warning 100
Copy
Warning 200
Copy
Error
Error 50
Copy
Error 100
Copy
Error 200
Copy
Info
Info 50
Copy
Info 100
Copy
Info 200
Copy
Get Colors from a Website

Find inspiration by getting colors from any website! Just enter the website address below, and we'll help you create a color palette that you can use in your theme.

Example of getting colors from a website
Created by Kitn © 2025