```javascript
npx shadcn-ui@latest add button
```

npx shadcn-ui@latest add 만 하면 여러 컴포넌트들 중에서 고를 수 있음.

![](https://server.tilnote.io/images/pages/d28703d5-ac3a-49b2-9b78-d4b776ee2c2f.png)

여기에서 선택해도 됨.

[shadcn/ui](https://ui.shadcn.com/) - 사용법은 여기에 다 있음.

## 버튼 추가하기

```javascript
import { Button } from "@/components/ui/button"
```

```javascript
<Button variant="outline">Button</Button>
```

<pre><code class="language-javascript">npx shadcn-ui@latest add button</code></pre>npx shadcn-ui@latest add 만 하면 여러 컴포넌트들 중에서 고를 수 있음.<img alt="shadcn 으로 Button 추가하기 image 1" src="https://server.tilnote.io/images/pages/d28703d5-ac3a-49b2-9b78-d4b776ee2c2f.png">여기에서 선택해도 됨.<a href="https://ui.shadcn.com/">shadcn/ui</a> - 사용법은 여기에 다 있음.<h2 id="버튼-추가하기">버튼 추가하기</h2><pre><code class="language-javascript">import { Button } from "@/components/ui/button"</code></pre><pre><code class="language-javascript">&lt;Button variant="outline"&gt;Button&lt;/Button&gt;</code></pre>