Back to Plugins
Swatch Lap

Swatch Lap

Smart Color Card Generator

Plugin Preview

Swatch Lap preview

About this plugin

SwatchLabSmart Color Card GeneratorSwatchLab is a modern Figma plugin that helps you generate clean, professional color swatches in seconds — with support for live editing, smart color naming, Pantone integration, and now color extraction from images or frames.Perfect for designers creating brand guidelines, UI kits, or professional color systems.✨ Key Features🎨 Generate Beautiful Swatch CardsAdd multiple colors, name them, and export them as neatly styled cards — with 5 format options (Hex, RGB, HSL, HSB, CMYK).🧠 Color Extraction (New!)Select any frame or image inside your Figma file, and SwatchLab will automatically extract the main colors, detect names, and add them directly to your palette.🔁 Live EditingUpdate colors, names, formats, and Pantone labels after generating — cards stay in sync instantly.🧠 Smart Color Naming (API Powered)Automatically detects color names as you type (via The Color API), with fallback support when offline.🏷️ Pantone SupportAdd Pantone codes to each color card for more professional control.📏 Multiple Card SizesChoose from 5 pre-defined sizes to match your brand or presentation needs.🌓 Dark Mode ReadyLight/dark themes with smooth transitions — toggle via emoji in the corner 🌙☀️🧩 Reorder Color FormatsDrag & drop to arrange formats in the order you prefer.✅ Output ReadyCards are generated as separate Figma frames in one clean line, easy to use, organize, and export.🛠 How to UseOpen the pluginAdd colors using HEX or color picker, or use the "Extract from Frame/Image" buttonCustomize names (or let the plugin suggest them)Add optional Pantone valuesChoose card size and formatsClick “Generate” — and you're done!🧠 Bonus FeaturesReal-time updates on every changeFormat validation and toggle systemResponsive UI with minimalist designWorks offline with fallback color dataClean layout, refined spacing, and modern interfaceDonation + dark mode controls built-in (bottom bar)📦 What You GetClean swatch cards with color preview, name, Pantone (if added), and selected formatsCards styled professionally with proper spacing, font, and shadowsFully editable frames aligned horizontally for easy access and export❤️ Loved by DesignersSwatchLab is built to help you document, organize, and present your colors like a pro — whether you're building a design system, branding a startup, or pitching a palette to your client.

Plugin Details

Version4
CreatedJuly 21, 2025
Last UpdatedDecember 3, 2025
Categorydesign-tools-other
CreatorMohi Hassan
Stats39 installs, 11 likes
PricingFree

Technical Details

  • API:1.0.0
  • UI:ui.html
  • main:code.js
  • Document Access:dynamic-page
  • Editor Types:
    figma
  • Allowed Domains:
    • https://www.thecolorapi.com