Renk Palette Extractor
Extract renk palettes den CSS, SCSS, ve HTML kod
Giriş Kod
Paste CSS, SCSS, or HTML code above to extract all color values into a visual palette.
Renk Palette Extractor
Extract renk palettes den CSS, SCSS, ve HTML kod
Özellikler
- Extracts hex (#fff, #ffffff), RGB, RGBA, HSL, HSLA, ve 148 named CSS renkler
- De-duplicates renkler ve counts usage frequency across sizin kod
- Sort palette tarafından frequency, hue, veya lightness
- Export as CSS variables, SCSS variables, veya JSON
- Copy individual renkler veya the full palette ile one tıklayın
- 100% client-side işleme - hayır veri leaves sizin tarayıcı
Nasıl Kullanılır
- Yapıştırın sizin CSS, SCSS, veya HTML kod içine the metin area.
- Colors are extracted automatically - hex, rgb, hsl, and named colors are all detected.
- Sort sizin palette tarafından frequency, hue, veya lightness.
- Tıklayın herhangi swatch to copy its hex değer.
- Choose an export format (CSS variables, SCSS, or JSON) and copy the full palette.
İpuçları ve En İyi Uygulamalar
- Try the 'Sample CSS' button to see the tool in action with a realistic stylesheet.
- Sort tarafından hue to see sizin renk spectrum at bir glance.
- Sort tarafından frequency to find hangi renkler dominate sizin codebase.
- Kullanmak the JSON export biçim to integrate renkler içine sizin build tooling.
- Yapıştırın bir entire stylesheet to audit sizin project's renk consistency.
SSS
What color formats does it detect?
The tool detects hex colors (3-digit #fff, 6-digit #ffffff, and 8-digit with alpha), rgb(), rgba(), hsl(), hsla() functions, and all 148 standard CSS named colors like 'red', 'dodgerblue', 'coral', etc.
How are duplicate colors handled?
Colors that resolve to the same hex value are merged into a single entry with a combined usage count. For example, 'red', '#ff0000', and 'rgb(255, 0, 0)' would all count as the same color.
Is my code private?
Yes, all processing happens entirely in your browser. No code or data is ever sent to any server.
Can I use this with SCSS or HTML?
Absolutely. The parser extracts color values from any text, so it works with CSS, SCSS, LESS, HTML inline styles, or even plain text containing color values.
What export formats are available?
You can export your palette as CSS custom properties (:root variables), SCSS variables ($variable syntax), or a structured JSON object with hex, RGB, HSL, and usage count for each color.