# Tinte

> Design system compiler for shadcn presets, themes, and agent plugins

Tinte turns design references or prompts into a unified set of semantic OKLCH tokens and design instructions. It compiles these tokens into directly installable shadcn/ui presets, editor themes, and AI agent skills, with a CLI to extract, build, and lint token usage in code.

Website: https://github.com/Railly/tinte

## What it is for

- Generate and install custom shadcn/ui color themes directly via the shadcn CLI
- Compile a website's brand tokens into an agent plugin (SKILL.md and CSS) for AI coders
- Lint codebase files to catch any colors or styles bypassing design tokens
- Export unified color palettes to VS Code, Cursor, Zed, and terminal configs

## Features

- Prompt-based and reference-based theme generator using OKLCH color models
- Preset API for shadcn v4 to install themes with npx shadcn add
- Agent plugin compiler generating SKILL.md and tokens.css for AI coding tools
- CLI tool to extract styles from live pages, normalize them, and lint paths
- Cross-format exporter supporting over 19 targets including editors and terminals
- Public API to search and retrieve public themes and preset packs

## Pricing

Open source. Free and open source (MIT license)

## Details

- Type: Web app
- Category: [Development](https://xiry.app/topics/development.md)
- Open source: yes
- Platforms: Web, Command line
- For: Frontend developers and designers using shadcn/ui and AI coding agents
- Alternative to: shadcn/ui themes, Realtime Colors, Coolors
- Tags: shadcn, theming, design tokens, agent skills, cli, tailwind

## Why it was saved

- [@RaillyHugo, 16 March 2025](https://x.com/RaillyHugo/status/1901105318651633696): Generates complete shadcn/ui themes (colors, radius) with copy CSS / save theme options; installable directly into a project.

## Compare

- [Alternatives to Coolors](https://xiry.app/alternatives/coolors.md)

## Related

- [shadcn Registry Directory](https://xiry.app/resources/shadcn-registry-directory): Discover and pull third-party component registries directly via the shadcn CLI (Website, Free)
- [Efferd](https://xiry.app/resources/efferd): Pre-built, responsive shadcn/ui blocks and layouts for React applications (Web app, Freemium)
- [21st.dev](https://xiry.app/resources/21st-dev): Curated directory of crafted React, Tailwind, and shadcn UI components. (Website, Freemium)
- [MicroKit UI](https://xiry.app/resources/microkit-ui): Free copy-paste React and CSS micro-interactions for modern web interfaces (Website, Free)
- [prompt-kit Primitives](https://xiry.app/resources/prompt-kit-primitives): Fullstack building blocks for AI apps installable with shadcn CLI (Web app, Open source)
- [ReUI](https://xiry.app/resources/reui): Curated shadcn/ui components, application blocks, animated elements, and MCP server. (Website, Freemium)

Updated 10 October 2026. Page: https://xiry.app/resources/tinte

Make your own library: Xiry takes your saved reels, tweets, Reddit bookmarks and Watch Later videos, makes them searchable and pulls the useful stuff out, like this library. It's invite-only for now; join the waitlist at https://xiry.app/#waitlist.
