Skip to content
Get packs

Creative Tim UI

A set of React/Next.js UI components and page blocks you add to shadcn/ui projects via a CLI.creativetimofficial/ui

GitHub Download v3.1.0
Stars
12.1k
Forks
4.8k
Licence
MIT
Language
TypeScript
Last update
8 months ago
Type
Library

What it is

Creative Tim UI is a collection of pre-built, customizable React components and page blocks (such as modals, testimonials, footers, and checkout sections) built on top of shadcn/ui. A command-line tool copies the chosen components into your Next.js project so you can edit them directly. It is aimed at getting web app interfaces built faster.

  • Add a pricing or testimonial section to a marketing site with one command
  • Start an admin or account settings page using the Application UI blocks
  • Build an ecommerce product listing or checkout flow from the ecommerce blocks

Great for

  • Developers building a Next.js site who already use or want to use shadcn/ui
  • Teams that want ready-made landing page sections such as footers, FAQs, or contact forms
  • Projects that use Tailwind CSS and want components they can customize

Not ideal for

  • Projects not using React or Next.js, since the README describes setup for Next.js projects only
  • People who need a finished app template rather than individual components and blocks
  • Anyone who cannot set up shadcn/ui and Tailwind CSS first, since these are listed as prerequisites
Step-by-step guide: how to use Creative Tim UIInstall, first run, examples, tips and FAQs
Creative Tim UI vs daisyUICreative Tim UI vs shadcn-vue

How to get it

  1. 1

    Install with a package manager

    You'll need: Node.js 18 or later · shadcn/ui initialized in your project · Tailwind CSS configured

    Add all components (uses the Creative Tim CLI)

    npx @creative-tim/ui@latest add all

    Add a single component

    npx @creative-tim/ui@latest add <component-name>

    Add all components via the shadcn CLI

    npx shadcn@latest add https://creative-tim.com/ui/r/all.json
  2. 2

    Run it

    • Make sure your Next.js project has shadcn/ui initialized (npx shadcn@latest init) and Tailwind CSS configured
    • Run npx @creative-tim/ui@latest add card to add one component
    • Import the added component into one of your pages and run your Next.js dev server
    • Browse the component list and block examples on the Creative Tim UI website to choose more
  3. 3

    Get the most out of it

    • Use the shadcn CLI route with a single component JSON (for example button.json) if you want only specific pieces
    • Browse the blocks by category (Application UI, Marketing, Ecommerce, Web 3.0) on the website to pick page sections
    • Customize the installed components directly in your project since they are copied into your code

Downloads

Source code (.zip)main branch · straight from GitHubRelease v3.1.0Release notes and sourceOfficial website & docswww.creative-tim.com/ui

Strengths

  • Components are built on shadcn/ui, a widely used foundation
  • Installs via the standard npx command or the shadcn CLI
  • Code is MIT licensed and can be edited after it is added to your project

Trade-offs

  • The README is short on details about individual components, so you will rely on the website documentation for specifics
  • Requires several prerequisites (Node.js 18+, shadcn/ui, Tailwind CSS) before it works

How it compares

ProjectStarsTypeLevelUpdatedBest for
ui (this)12.1kLibraryintermediate8 months agoDevelopers building a Next.js site who already use or want to use shadcn/ui
daisyui42.7kLibraryintermediate6 days agoDevelopers already using Tailwind CSS who want prebuilt components
shadcn-vue10.8kLibraryintermediate9 days agoVue developers who want ready-made UI components they can edit directly
awesome-shadcn-ui20.7kCurated listbeginner4 days agoDevelopers looking for ready-made shadcn/ui components such as calendars, date pickers, forms or dialogs
ui127kLibraryintermediate4 days agoDevelopers building React or Next.js interfaces who want full control over component code
AdminLTE45.7kLibrarybeginner5 days agoDevelopers building an internal admin panel or back-office tool quickly

Stats synced from GitHub. The assessment above was drafted with AI from the project's README on 2026-10-29 and may miss recent changes — check the README before relying on a command. MIT licence: free to use, modify and distribute, including commercially, as long as you keep the copyright notice.