# tweakcn Editor e gerador visual de temas para shadcn/ui com Tailwind CSS e IA - Findings24: - Site: - Preços: Freemium - Categorias: Ferramentas divertidas de IA ## O que é 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. ## O que tweakcn pode fazer? ### 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. ## Casos de uso ### 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. ## Perguntas frequentes ### 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. ## Informações rápidas - **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