ceoseo / tauri-ui

🦀 Create modern Tauri desktop apps in just a few simple steps with shadcn/ui. React, Next.js, Sveltekit.

updates soon

Create modern Tauri desktop apps in just a few simple steps. Tauri UI Templates is a starting point for building modern desktop applications with web technologies with using shadcn/ui, Tauri.

You can download pre-built final bundles from the Releases section.

Getting Started

Use create-tauri-ui to quickly scaffold a Tauri UI project.

pnpm create tauri-ui

npx create-tauri-ui@latest
pnpm create tauri-ui
npm create tauri-ui@latest
yarn create tauri-ui

Then follow the prompts!

You can also directly specify the project name and the template you want to use via additional command line options. For example, to scaffold a Tauri-UI project, run:

# npm 7+, extra double-dash is needed:
npm create tauri-ui@latest my-tauri-app -- --template vite

# yarn
yarn create tauri-ui my-tauri-app --template next

# pnpm
pnpm create tauri-ui my-tauri-app --template sveltekit

You can use . for the project name to scaffold in the current directory.

Or clone the repository

gh repo clone agmmnn/tauri-ui
cd tauri-ui/templates/<template>

pnpm i
pnpm tauri dev
pnpm tauri build

Features

• Components-based UI design with shadcn/ui. Radix UI for UI primitives.
• Native-looking window controls with tauri-controls.
• Support for dark and light modes.
• Lucide Icons, Radix Icons.
• Bundle size optimized Cargo.toml (.msi 2.5mb, .dmg 1.9mb, .deb 2mb)
• Tauri GitHub Action, Cross-platform releases.

Update Components

shadcn/ui

Update all components:

npx shadcn-ui@latest add --overwrite
# press "a" to select all components

Update a specific component:

npx shadcn-ui@latest add dialog --overwrite

Acknowledgements

This project utilizes code from the following repository:

• vitejs/create-vite - Used in create-tauri-ui
• shadcn/ui - Used in Next.js and Vite templates
• huntabyte/shadcn-svelte - Used in SvelteKit template