Skip to content
Recursica

What is Recursica?

Recursica is an open-source design system for agencies and product teams who build for many clients, platforms, and tech stacks.

Recursica doesn’t replace a team’s component library. It sits on top of the library the team already uses and connects design to code, so a brand looks the same from the first mockup to the shipped product, whether a person or an AI agent built it.

The parts of the system

Theme Forge

A browser-based editor for design tokens. Designers set up color palettes, type, spacing, and elevation, see them on real components, and export standard DTCG token files. See Theme Forge.

Figma Kit

A Figma component library built from the same tokens, versioned in a repository. After a Theme Forge export is imported, the Figma files match the code. See Figma Kit.

UI adapters

Wrappers for Mantine and Material UI in React, and for Angular Material. They apply the tokens to every component and only accept the options the design system allows, so nobody can quietly restyle a component. See UI adapters.

Design knowledge

Border UX’s design knowledge, written as skills an AI agent reads before it builds or reviews a screen. The skills are plain markdown in a repository that anyone can edit. See Knowledge.

Agents

A team of AI agents that research, design, review, and keep the skills up to date, working alongside people in chat. See the team.

Research pipeline

Interview transcripts go in, and tagged quotes, themes, and personas come out. Every finding links back to the line it came from, so a person can check it. See Knowledge & Skills.

Recursica MCP

A server that lets AI coding assistants like Claude and Gemini look up a project’s components and the guidelines for using them while they write code. See Recursica MCP.

Snippy

A Chrome and Firefox extension for leaving design feedback on any website. It exports a single report that designers can share and agents can act on. See Snippy.

The idea behind it: change the theme, not the component

  • Tokens do the work. If a component needs to look different, change the tokens in Theme Forge. Don’t write a one-off CSS override.
  • Agents get clear rules. Simple, consistent component props and written skills give an AI assistant less to guess, so what it builds is closer to right the first time.