> ## Documentation Index > Fetch the complete documentation index at: https://mintlify.com/shadcn-ui/ui/llms.txt > Use this file to discover all available pages before exploring further. # Astro > Install and configure shadcn/ui for Astro ### Create project Start by creating a new Astro project: ```bash theme={null} npx create-astro@latest astro-app --template with-tailwindcss --install --add react --git ``` ### Edit tsconfig.json file Add the following code to the `tsconfig.json` file to resolve paths: ```ts title="tsconfig.json" {4-9} showLineNumbers theme={null} { "compilerOptions": { // ... "baseUrl": ".", "paths": { "@/*": [ "./src/*" ] } // ... } } ``` ### Run the CLI Run the `shadcn` init command to setup your project: ```bash theme={null} npx shadcn@latest init ``` ### Add Components You can now start adding components to your project. ```bash theme={null} npx shadcn@latest add button ``` The command above will add the `Button` component to your project. You can then import it like this: ```astro title="src/pages/index.astro" {2,16} showLineNumbers theme={null} --- import { Button } from "@/components/ui/button" --- Astro + TailwindCSS
```