Cor Palette Extractor
Extract cor palettes de CSS, SCSS, e HTML código
Entrada Código
Paste CSS, SCSS, or HTML code above to extract all color values into a visual palette.
Cor Palette Extractor
Extract cor palettes de CSS, SCSS, e HTML código
Recursos
- Extracts hex (#fff, #ffffff), RGB, RGBA, HSL, HSLA, e 148 named CSS cores
- De-duplicates cores e counts usage frequency across seu código
- Sort palette por frequency, hue, ou lightness
- Export as CSS variables, SCSS variables, ou JSON
- Copy individual cores ou o full palette com one clique
- 100% client-side processamento - não dados leaves seu navegador
Como usar
- Cole seu CSS, SCSS, ou HTML código em o texto area.
- Colors are extracted automatically - hex, rgb, hsl, and named colors are all detected.
- Sort seu palette por frequency, hue, ou lightness.
- Clique qualquer swatch para copy its hex valor.
- Choose an export format (CSS variables, SCSS, or JSON) and copy the full palette.
Dicas e Melhores Práticas
- Try the 'Sample CSS' button to see the tool in action with a realistic stylesheet.
- Sort por hue para see seu cor spectrum em um glance.
- Sort por frequency para find qual cores dominate seu codebase.
- Usar o JSON export formato para integrate cores em seu build tooling.
- Cole um entire stylesheet para audit seu project's cor consistency.
Perguntas Frequentes
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.