---
title: Design in Figma with the same system you ship
description: Turn any shadcn/ui preset into native Figma variables, styles, components, and reusable app blocks on one free-tier-friendly page.
sidebar:
  label: Niram
  order: 0
---

Niram turns a [shadcn/ui](https://ui.shadcn.com) preset into native Figma variables, styles, components, and app blocks. Paste one preset code and generate a complete, reusable design-system surface on a single Figma page.

**[Get started](/getting-started)**

Install the plugin and generate your first system from a shadcn preset.

**[Design system](/design-system)**

See the variables, text styles, effects, and theme tokens Niram creates.

**[Components](/components)**

Explore the reusable shadcn-style component surface.

**[Blocks](/blocks)**

Browse evergreen app blocks and their install commands.

## One preset, one coherent Figma system

- **Native tokens** — Tailwind colors, spacing, radius, typography, opacity, borders, shadows, and blur become Figma variables and styles.
- **Light and dark together** — the free-tier-friendly theme uses one mode with `dark-*` twin variables.
- **Real component instances** — blocks reuse generated components instead of flattening the design into static artwork.
- **Safe to regenerate** — changing presets updates the same collections, styles, and regions in place.
- **Fully offline** — the plugin does not use network requests, analytics, or third-party services.

:::tip
[Install Niram from the Figma Community](https://www.figma.com/community/plugin/1642487887236877076/niram-shadcn-design-system-generator) and start with any preset from [shadcn Create](https://ui.shadcn.com/create).
:::