Theme Generator

Your color has been automatically placed at position:
color-600

The position is determined by analyzing the brightness of your selected color. Brighter colors are placed in lower positions (100-400), medium colors in the middle (500), and darker colors in higher positions (600-900).

Detected format: HEX

Text/Background Contrast Ratio: 10.14 - Excellent (AAA)

Generated Colors

Color range: 50-950 (from lightest to darkest)

All colors maintain some of the original hue, even at the extremes.

Your selected color (#0d9b44) is positioned at color-600
--color-50
#f9fbfa
--color-100
#dbeddd
--color-200
#bddfc1
--color-300
#9fd1a6
--color-400
#81c28b
--color-500
#60b470
--color-600
#39a556
--color-700
#158c3f
--color-800
#1d6331
--color-900
#1a3b22
--color-950
#111814

Theme Preview

Light Section

This section uses lighter shades from our theme.

Dark Section

This section uses darker shades from our theme.

Color

Product Title

A short description of the product with details about features.

$49.99

User Profile

Experience85%
Skills70%
Projects90%

Analytics Dashboard

Users
Sales
Revenue

Information Message

This is an informational notification.

Warning Message

This is a warning notification.

Alert Message

This is an alert notification.

Mobile App

Feature Title

Feature description text goes here.

List Item 1
List Item 2
List Item 3