While transitioning from web development to UI/UX design, I needed a faster way to manage colors in Figma. Manually creating shades, checking accessibility, and managing variable bindings took too much time — and focus.
That's why I built Inked Colibri — to automate the most repetitive tasks in color and variable management, so designers can focus on design instead of setup.
Color is the foundation of every design system. Generate variable-based palettes, experiment safely with color swatches, and validate accessibility with APCA contrast testing. All features work seamlessly together for a complete color management workflow.
Create complete variable sets — including shades, and transparency variants** — directly in Figma.
Bring your color experiments from RealTimeColors.com straight into Figma as variable-ready palettes.
Generate an APCA contrast table showing all possible combinations for shades and alpha variations. Validate accessibility for every color pair in your palette.
Generate color swatch frames as visual backups, and quickly revert or switch between schemes. Safe experimentation with one-click rollback.
Use JSON as a shared format between design intent, AI communication, and variable generation. Describe your structure once — Inked Colibri generates variables, rebinds across files, and updates style paths automatically while maintaining consistency.
Use paths to define Figma collection folder structure and variable names for autobinding during generation. JSON structure is perfect for communicating with AI about your variable and styles structure — execute with one click using the plugin.
Using JSON structure, generate large sets of variable collections and style groups inside Figma. Supports variable-to-variable binding and style-to-variable binding capabilities — build consistent token systems faster than ever. Instead of days, make it happen as fast as AI can understand your requirements and generate JSON schema.
Automatically rebind detached variables when moving components between files. Compares variable names and restores relationships without manual relinking — perfect for maintaining consistency across design systems.
Apply new color schemes or rename style paths instantly across your design system. Updates semantic structures while keeping bindings intact — ideal for testing palettes, refining themes, or evolving hierarchies.
Build step by step with ready-made JSON patterns. Start with size variables, layer typography and layout variables, then export to CSS for seamless developer handoff. Each scheme builds on the previous one.
Use the ready AI prompt from JSON Patterns documentation to communicate with ChatGPT, DeepSeek, or Gemini. Get faster with your JSON schema generation by ensuring you and AI use the same format, terminology, and structure from the start.
Initially available size variable JSON schemes use Tesla (3/6/9) scaling. Use them as-is, or share with AI on the JSON Patterns index page to change values as you prefer — for example, replace with Material Design Fibonacci sequence or other size metrics. These are initial optional values from Inked Colibri's design system. Define consistent numeric tokens for spacing, typography, and layout — the foundation for your design system.
Build typography variables that link text properties (font size, line height, letter spacing, font family) to your size variables. Generate text styles in Figma that match your structure perfectly.
Define layout variables for padding, gaps, and margins across components. Keeps layout logic consistent and modular for responsive design patterns throughout your system.
Export your Figma variable hierarchy into matching CSS variables — ready for developer handoff. Automatically converts paths like Layout/Settings/Mobile Min to --layout-settings-mobile-min, maintaining consistency from design to code.
Everything you need to know about Inked Colibri
Inked Colibri generates complete variable sets — including shades, and transparency variants — directly in Figma. You can import palettes from RealTimeColors.com or create them through the plugin interface. It automatically generates shades and alpha variations (5% to 100%) for each color role (Primary, Secondary, Accent, Text, Background), storing them in your Figma Variables panel under the RTC collection.
Yes! Inked Colibri includes built-in APCA (Advanced Perceptual Contrast Algorithm) testing. Generate an APCA contrast table showing all possible combinations for shades and alpha variations. The matrix displays values directly on colored cells, labeled with RTC variable names, so you can validate accessibility for every color pair in your palette.
Using JSON structure, Token Commander generates large sets of variable collections and style groups inside Figma. It supports variable-to-variable binding and style-to-variable binding capabilities. Describe your system once in JSON — the plugin handles structure, hierarchy, types, and references. Build consistent token systems faster than ever — instead of days, make it happen as fast as AI can understand your requirements and generate JSON schema.
JSON structure uses paths to define Figma collection folder structure and variable names for autobinding during generation. It's perfect for communicating with AI (ChatGPT, DeepSeek, Gemini) about your variable and styles structure — execute with one click using the plugin. Provides a single source of truth for paths, types, and values, perfect for AI-assisted generation or manual creation.
Absolutely! Generate color swatch frames as visual backups, and quickly revert or switch between schemes. Each swatch displays all shades and alpha variations, plus a Realtime Colors URL for one-click rollback. Perfect for safe experimentation with brand exploration or comparing multiple palette directions side by side.
The Rebind Variable feature automatically rebinds detached variables when moving components between files. It compares variable names and restores relationships without manual relinking — perfect for maintaining consistency across design systems when sharing components.
Initially available are size, typography variable and style JSON schemes, and layout variables. You can use these schemes as-is, or share them with AI. By sharing context with AI on the JSON Patterns index page, ask AI to change values as you prefer — for example, replace Tesla (3/6/9) with Material Design Fibonacci sequence or other size metrics. These are initial optional values used in Inked Colibri's design system. The complete design system JSON schemes will be available soon.
Yes! Export your Figma variable hierarchy into matching CSS variables — ready for developer handoff. The export automatically converts paths like `Layout/Settings/Mobile Min` to `--layout-settings-mobile-min`, maintaining consistency from design to code. Supports both color tokens and complete design tokens exports.
Absolutely! Inked Colibri is specifically designed for large design systems. It handles complex token management, supports multiple color schemes, generates large variable collections, provides automatic rebinding across files, and offers tools for safe experimentation. Build consistent token systems faster than ever with AI-assisted JSON generation.
With Inked Calibri Figma plugin, spend less time on technical stuff and more time being creative.