We've added support for package imports and aliases in files.target in shadcn@4.7.0.

Package imports#

The shadcn CLI now supports package.json#imports for installing components, rewriting imports, and resolving third-party registries. You can use private #... import aliases from your package.json instead of relying only on compilerOptions.paths in tsconfig.json.

Copy{
  "imports": {
    "#components/*": "./src/components/*.tsx",
    "#lib/*": "./src/lib/*.ts",
    "#hooks/*": "./src/hooks/*.ts"
  }
}

Then use the same roots in components.json:

Copy{
  "aliases": {
    "components": "#components",
    "ui": "#components/ui",
    "lib": "#lib",
    "hooks": "#hooks",
    "utils": "#lib/utils"
  }
}

This also works in monorepos where app-local files use package imports and shared UI files are imported from workspace package exports.

See the package imports guide for setup details.

Target aliases#

Registry items can now use target aliases in files[].target to install files under the user's configured shadcn directories. For example, the following registry item will install the prompt-input.tsx file under the ui/ai directory.

Copy{
  "files": [
    {
      "path": "registry/default/ai/prompt-input.tsx",
      "type": "registry:ui",
      "target": "@ui/ai/prompt-input.tsx"
    }
  ]
}

See the registry examples for more details.

We added shadcn preset commands for working with preset codes.

Decode a preset#

You can decode a preset code to see exactly what it contains:

pnpmnpmyarnbun
pnpm dlx shadcn@latest preset decode b5owWMfJ8l
Copy

CopyPreset
  code         b5owWMfJ8l
  version      b
  style        mira
  baseColor    mauve
  theme        mauve
  chartColor   amber
  iconLibrary  hugeicons
  font         inter
  fontHeading  oxanium
  radius       large
  menuAccent   subtle
  menuColor    inverted-translucent
  url          https://ui.shadcn.com/create?preset=b5owWMfJ8l

Resolve from a project#

Use preset resolve in an existing project to see the preset that matches your current configuration.

pnpmnpmyarnbun
pnpm dlx shadcn@latest preset resolve
Copy

CopyPreset
  code         b5Kc6P0Vc
  version      b
  style        luma
  baseColor    olive
  theme        lime
  chartColor   sky
  iconLibrary  hugeicons
  font         geist
  fontHeading  inherit
  radius       default
  menuAccent   subtle
  menuColor    default
  url          https://ui.shadcn.com/create?preset=b5Kc6P0Vc

It works with monorepos too:

pnpmnpmyarnbun
pnpm dlx shadcn@latest preset resolve -c apps/web
Copy

Share or open#

Use preset url when you need a shareable link:

pnpmnpmyarnbun
pnpm dlx shadcn@latest preset url b5owWMfJ8l
Copy

Copyhttps://ui.shadcn.com/create?preset=b5owWMfJ8l

Use preset open to open the preset on shadcn/create for customization:

pnpmnpmyarnbun
pnpm dlx shadcn@latest preset open b5owWMfJ8l
Copy

CopyOpening https://ui.shadcn.com/create?preset=b5owWMfJ8l in your browser.

This makes presets easier to inspect, share, and hand off to coding agents without manually decoding codes or building URLs.

You can now enable cursor: pointer for buttons when initializing a project.

pnpmnpmyarnbun
pnpm dlx shadcn@latest init --pointer
Copy

This adds the following CSS to your global CSS file:

Copy@layer base {
  button:not(:disabled),
  [role="button"]:not(:disabled) {
    cursor: pointer;
  }
}

The --pointer option is not part of preset codes. It is applied as a project setup option, similar to --rtl.

You can now selectively apply a preset.

Say someone shares a preset with you and you already have your own components, but you like the theme or the fonts. Now you can apply just that.

Keep your components. Apply only what you want.

Copy# Apply the full preset.
npx shadcn@latest apply --preset b2D0vQ7G4
 
# Apply only the theme.
npx shadcn@latest apply --preset b2D0vQ7G4 --only theme
 
# Apply only the fonts.
npx shadcn@latest apply --preset b2D0vQ7G4 --only font
 
# Apply theme and fonts.
npx shadcn@latest apply --preset b2D0vQ7G4 --only theme,font

The default behavior is unchanged. Running shadcn apply --preset <preset> still applies the full preset.

Partial preset apply currently supports theme and font.

Introducing Sera, a new shadcn/ui style. Minimal. Editorial. Typographic. Underline Controls and Uppercase Headings. Shaped by Print Design Principles.

Try Sera in shadcn/create

Sera is a typography-first style built on print design principles. It pairs serif headings with sans-serif body text, uses square corners, uppercase tracking, and underlined controls to create an editorial feel for your app.

Like the other new styles, Sera goes beyond theming. It changes the geometry, spacing, and feel of the components so your app starts from a different visual baseline.

Available now in shadcn/create for both Radix and Base UI.