Skip to content
Tattva

Downloads

Pick the group that matches you. Every file is free to take, with no sign-up.

files
9
icons in the zip
62
sign-ups needed
0

Not sure what you need? Start here and we'll point you to the right file.

For designers

Colours, sizes and icons to use in your own design tools.

  • Colours and sizes

    tokens.json

    Use it when your design tool can import tokens. Every colour, size and timing, for light and dark.

    Download

  • Figma plugin

    tattva-figma-plugin.zip

    Adds Tattva's parts to a Figma file as components, with colours (light and dark), corners, sizes and text styles, and checks a design for contrast, text size and tap size. Easiest from Figma Community (Get started, Plugins); this file is for working offline: unzip, then in Figma choose Plugins, Development, Import plugin from manifest.

    Download

  • Icons

    icons.zip

    Use it when you need the icons as picture files. They take their colour from the text around them.

    Download

For AI tools

For Claude, ChatGPT, Cursor, Lovable, v0 and Bolt.

  • Your prompt, written for you

    Build brief

    Start here. Answer five plain questions and get one prompt to paste into your AI tool.

    Make my prompt

  • Connect your AI tool

    tattva-mcp.zip

    Use it when you want your tool to look things up itself and check its own work. Steps for each tool.

    See the steps

  • All the source in one file

    tattva-free-source.md

    Use it when your AI builder cannot unzip or install anything. Give it this one file.

    Download

  • Plain index for AI

    llms.txt

    A page of links written for AI tools to read. You can paste its address into a prompt.

    Download

For developers

To build with the parts in your own React project.

  • Every part, as code

    tattva-free.zip

    Unzip into src/ and import from ./tattva.

    Download

  • Colours as CSS

    tokens.css

    Import it once. It also sets up Tailwind and the seven colour themes.

    Download

Advanced

Files for tools that read them. Most people can skip these.

  • Every part, as data

    components.json

    Props, rules and accessibility notes for every part, in one file for tools and scripts.

    Download

  • Tokens in the open standard

    tokens.dtcg.json

    The same tokens in the Design Tokens Community Group format, light and dark side by side.

    Download

Icons

The zip has every icon, not just these.

Using the tokens

Colors and sizes are named for what they do, such as “surface” or “text muted”, not for how they look. Change the value in one place and every part follows.

var(--surface) · var(--fg) · var(--accent)

Build your next AI screen with Tattva.

Free and open, with the code. Start in one line.

Get started