Generați nuanțe de culoare dintr-o singură culoare de bază

Instrucţiuni

Ajustarea culorii de bază folosind panoul de instrumente din dreapta pentru a modifica gama de nuanțe. Folosește butonul de editare pentru a modifica culoarea de bază. Componentele de previzualizare din stânga se vor actualiza automat pe măsură ce faci modificări. Creează cu ușurință valori pentru variabilele CSS, Tailwind, SwiftUI sau CSS și copiază-le în clipboard.

Example Components

New Release

Premium Wireless Headphones

High-fidelity audio with active noise cancellation, premium materials, and up to 30 hours of battery life. Perfect for music enthusiasts and professionals.

(128)

$249.99$299.9917% off

The Future of Web Development: AI-Powered Tools and Automation

Technology

Alex Chen

Mar 15, 2025

The Future of Web Development: AI-Powered Tools and Automation

Explore how artificial intelligence is revolutionizing web development workflows, making developers more productive and efficient than ever before.

8 min read

1205

15Apr

Workshop

Web Development Workshop 2025

Join us for an intensive workshop on modern web development practices. Learn about the latest frameworks, tools, and techniques from industry experts. This hands-on session will cover everything from frontend development to backend architecture and deployment strategies.

Tue, Apr 15, 2025

9:00 AM - 5:00 PM

Tech Innovation Hub

123 Developer Street, Silicon Valley, CA

45 going

5 spots left

$299

Revenue Overview

Monthly revenue performance and key metrics

Total Revenue

$48,234

12.5%

vs. last month

Average Order Value

$156

3.2%

vs. last month

Conversion Rate

3.8%

1.1%

vs. last month

Active Customers

1,429

8.4%

vs. last month

Button States

Demonstration of primary button states: normal, hover, active, and disabled

Normal State

Hover State

Active State

Interactive Example

Disabled State

Sarah Wilson

Senior Product Designer

Passionate about creating beautiful and functional user experiences. Focused on design systems and component-driven development.

Explore More Color Shades

Red Green Blue Yellow Cyan Magenta Black White Gray Orange Purple Brown Alice Blue Antique White Aqua Aquamarine Azure Beige Bisque Blanched Almond Blue Violet Burly Wood Cadet Blue Chartreuse Chocolate Coral Cornflower Blue Cornsilk Crimson Dark Blue Dark Cyan Dark Golden Rod Dark Gray Dark Green Dark Khaki Dark Magenta Dark Olive Green Dark Orange Dark Orchid Dark Red Dark Salmon Dark Sea Green Dark Slate Blue Dark Slate Gray Dark Slate Grey Dark Turquoise Dark Violet Deep Pink Deep Sky Blue Dim Gray Dim Grey Dodger Blue Fire Brick Floral White Forest Green Gainsboro Ghost White Gold Golden Rod Green Yellow Honey Dew Hot Pink Indian Red Indigo Ivory Khaki Lavender Lavender Blush Lawn Green Lemon Chiffon Light Blue Light Coral Light Cyan Light Golden Rod Yellow Light Gray Light Green Light Pink Light Salmon Light Sea Green Light Sky Blue Light Slate Gray Light Steel Blue Light Yellow Lime Lime Green Linen Maroon Medium Aqua Marine Medium Blue Medium Orchid Medium Purple Medium Sea Green Medium Slate Blue Medium Spring Green Medium Turquoise Medium Violet Red Midnight Blue Mint Cream Misty Rose Moccasin Navajo White Navy Old Lace Olive Olive Drab Orange Red Orchid Pale Golden Rod Pale Green Pale Turquoise Pale Violet Red Papaya Whip Peach Puff Peru Pink Plum Powder Blue Rebecca Purple Rosy Brown Royal Blue Saddle Brown Salmon Sandy Brown Sea Green Sea Shell Sienna Silver Sky Blue Slate Blue Slate Gray Snow Spring Green Steel Blue Tan Teal Thistle Tomato Turquoise Violet Wheat White Smoke Yellow Green

Medium Slate Blue

#6366f1

100%

Gama de culori

100

200

300

400

500

600

700

800

900

950

  medium-slate-blue: #6366f1;

Insert Color Range