---
title: Introduction
description: Design a shadcn/ui theme in the browser, then install it in your app with one command.
url: https://tweakcn.thally.app/
---

# Introduction

Design a shadcn/ui theme in the browser, then install it in your app with one command.

A shadcn/ui theme is a set of CSS variables. tweakcn edits those variables for
light and dark mode and shows the result on real components. The editor is free
and needs no account. You need an account only to save themes, share them, and
use AI.

![The tweakcn theme editor with the Colors tab open](/images/editor-colors.png)

## Get started

#### [Install your first theme](/quickstart)

    Add a preset to a new Next.js app and check light and dark mode.

#### [Start a project with a theme](/cli/shadcn-create)

    Create a shadcn/ui project and apply a tweakcn theme in one command.

#### [Install themes with the CLI](/cli/install-themes)

    Learn the registry URLs for presets and saved themes.

## Build your theme

#### [Use a preset](/themes/presets)

    Start from one of 42 built-in themes.

#### [Modify a theme](/themes/modify-a-theme)

    Change colors, fonts, radius, spacing, and shadows.

#### [Create your own theme](/themes/create-a-theme)

    Build a theme from your brand colors.

#### [Import your CSS](/themes/import-css)

    Bring an existing theme into the editor.

## Use AI

#### [Generate a theme with AI](/ai/generate)

    Describe a theme or upload an image.

#### [Enhance a theme with AI](/ai/enhance)

    Remix or tweak a theme with a prompt.

## Save and share

#### [Save and share a theme](/sharing/save-and-share)

    Keep your theme and send a link to your team.

#### [Manage saved themes](/sharing/manage-themes)

    Apply, publish, or delete the themes you saved.

#### [Publish to the community](/sharing/publish)

    List your theme on the community page.