CRX id
laodgkeclopjcocodanadapgbpbkpild
laodgkeclopjcocodanadapgbpbkpild
Description from extension meta
Extract color palettes(can be exported in HEX, RGB, HSL or Tailwind CSS format), fonts, images directly from any website.
Image from store
Description from store
Snap CSS Style 🎨✨
Extract color palettes and typography from any website, instantly convert to Tailwind CSS format.
🚀 Overview
Snap CSS Style is a Chrome extension that extracts colors and fonts from websites and transforms them into ready-to-use design tokens. Perfect for developers and designers who want to capture any website's visual style.
✨ Key Features
🎨 Color Extraction
Smart Analysis: Identifies prominent colors using area-based algorithm
Auto-categorization: Primary/secondary backgrounds, text colors, accents
Multiple Formats: HEX, RGB, HSL, OKLCH with one-click switching
Color Names: Human-readable names via TheColorAPI
🎯 Tailwind CSS Export
Tailwind v3: JavaScript objects for tailwind.config.js
Tailwind v4: CSS variables for the new format
Full Scales: Auto-generates 50-950 color scales
One-Click Copy: Export entire palettes instantly
🔤 Typography Analysis
Complete font stacks with fallbacks
Usage statistics and CSS-ready output
Font properties (size, weight, line-height)
🖼️ Image Assets
Asset Scanner: Automatically detects all images from any website
Bulk Download: Download multiple images with one click
Format Support: JPG, PNG, SVG, WebP, and more
💡 User Interface
Floating, draggable widget
Tab navigation (Colors/Fonts)
Progress tracking for large sites
Format selector and palette generator
📋 How to Use
Click extension icon on any website
Wait for analysis to complete
Browse colors organized by usage
Generate palettes from any color
Select export format (Tailwind v3/v4)
Copy palette or switch to Fonts tab
🎯 Perfect For
UI/UX designers creating style guides
Frontend developers implementing designs
Design system engineers
🔒 Privacy
Only analyzes current tab when clicked
All processing happens locally
No data collection
💬 Support
Love Snap CSS Style? Rate us on the Chrome Web Store!