Radix Colors

Radix Color Importer for Framer

A powerful plugin that gives you instant access to the professional-grade Radix Colors system (by WorkOS, https://www.radix-ui.com/colors) that enhances your design workflow and ensures accessibility.

What are Radix Colors?

Radix Colors is a sophisticated color system created by the UI experts at WorkOS (makers of Radix UI). This system offers:

• Accessibility first: Colors designed to meet contrast standards

• Complete design system: 30 color scales with 12 carefully calibrated steps each

• Automatic dark mode: Built-in light/dark mode pairings for all colors

• Scientific approach: Colors derived using color science principles

• Transparency options: Alpha versions of all colors for versatile design

Features

• 🎨 Complete palette: Import all color scales with their variations

• 🌓 Light/dark mode ready: Colors automatically adapt to theme changes

• 🔍 Live preview: See how colors look in your current Framer theme

• ✅ Flexible selection: Choose exactly which colors to import

• 🧠 Smart organization: Intuitive naming for easy access (e.g., "Radix/blue10")

How to Use

1. Install the plugin from the Framer Marketplace

2. Open the plugin from the main toolbar

3. Select between solid colors or alpha (transparency) colors

4. Choose individual colors or entire color families

5. Click "Import" to add the selected colors to your project's color styles

Why Use This Plugin?

This plugin eliminates hours of manual color setup work. Instead of creating color styles one by one, you get immediate access to a professional color system used by top designers worldwide.

Perfect for:

• Designers starting new projects who need a reliable color foundation

• Teams wanting consistent colors across light and dark modes

• Anyone looking to upgrade their design system with accessible, well-crafted colors