tweakcn logo

tweakcn

Freemium
방문

shadcn/ui용 비주얼 테마 편집기 및 생성기, Tailwind CSS와 AI 지원

tweakcn란 무엇인가요?

tweakcn is a visual theme editor and generator for shadcn/ui. It helps developers build and refine custom themes by changing colors, typography, and other theme properties in a live preview instead of editing styles blindly.

The product supports Tailwind CSS v4 and v3, works with shadcn/ui and custom styles, and offers export paths for copying CSS variables or a Shadcn Registry command into a project. The home page also positions it as a no-signup starting point with community themes and AI-assisted theme creation.

tweakcn(으)로 무엇을 할 수 있나요?

Color controls

Adjust background, text, border, accent, chart, and sidebar colors through a visual interface instead of editing theme tokens by hand.

Typography settings

Tune font size, weight, and text transform so the theme matches the tone and hierarchy of the interface.

Tailwind version support

Switch between Tailwind v4 and v3 while working with supported color formats such as OKLCH and HSL.

Detailed property editing

Edit radius, spacing, shadows, and other theme properties for broader control over component appearance.

Contrast checker

Check contrast ratios while editing to catch accessibility issues before export.

AI theme generation

Create a theme from an image or prompt in the AI flow, then refine it in the editor.

사용 사례

“Create a custom app theme”

Start from a preset or community theme, then adjust colors, radius, and typography until the design fits a specific product brand.

“Generate a theme from an idea”

Use the AI theme flow to generate a starting point from an image or prompt, then refine the result in the editor.

“Export a usable theme for implementation”

Move theme settings into a project by exporting CSS variables or a Shadcn Registry command after previewing the result.

“Explore and reuse community designs”

Browse public community themes for inspiration, then compare styles by tags such as minimal, professional, dashboard, or cyberpunk.

“Validate contrast during design”

Check contrast ratios while iterating on colors to keep the theme closer to accessible UI choices.

자주 묻는 질문

What is tweakcn?

tweakcn is a visual theme editor and generator for shadcn/ui. It lets you customize colors, typography, layout-related properties, preview changes in real time, and export the result as code or CSS variables.

Is tweakcn free?

Yes. The pricing page includes a Free plan and a Pro plan. The Free plan includes full theme customization, 5 AI-generated themes, saving and sharing up to 10 themes, importing and exporting via CSS variables, exporting via a Shadcn Registry command, and a contrast checker.

What's included in Pro?

Pro adds unlimited saved and shared themes, unlimited AI-generated themes, image-based theme generation, priority support, and the ability to save your own fonts and colors.

Does tweakcn support Tailwind v4?

The source explicitly says tweakcn supports Tailwind CSS v4, and the editor page also references Tailwind v3. The pricing and home copy also mention shadcn/ui and custom styles.

Can I use tweakcn with existing projects?

Yes. The home page says you can start customizing without signup, and the pricing page includes a Free plan that supports full theme customization. The editor is positioned for shadcn/ui projects, including importing and exporting themes through CSS variables or a Shadcn Registry command.

주요 정보

Category
Design Tool / Developer Tool
Primary use
Theming shadcn/ui components
Platforms / stack
Web app; Tailwind CSS v4 and v3; shadcn/ui
Entry point
Free plan available; Pro is $8/month billed monthly
Notable workflows
Visual editing, AI theme generation, community browsing, CSS variable export, Shadcn Registry export
Website
tweakcn.com

tweakcn 트래픽 분석

트래픽 데이터는 참고용으로만 확인하세요.

도메인 평점
63