# cards

### Card Product

<figure><img src="https://2221554152-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FPCf6vtFuZEPHXJd7JfIe%2Fuploads%2FhYSSy34zVhxBxHyN6DN9%2FScreenshot%202024-08-26%20at%2014.23.45.png?alt=media&#x26;token=00985134-5cc3-4626-9c4c-2d45bb0be1b6" alt=""><figcaption><p>Product card design</p></figcaption></figure>

To use this card in your project, copy and paste the following card into your html.erb file:

```
<%= render "components/card_product_image"
```

***

### Card without image

<figure><img src="https://2221554152-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FPCf6vtFuZEPHXJd7JfIe%2Fuploads%2FYQQvx27fS2q6TGrGUUNY%2FScreenshot%202024-08-26%20at%2014.27.15.png?alt=media&#x26;token=b942039f-96ab-441f-b77b-5fea1d49d960" alt=""><figcaption></figcaption></figure>

To use this card in your project, copy and paste the following card into your html.erb file:

```
<%= render "components/card_no_image"
```

***

### See more card designs:

* [HyperUi cards](https://www.hyperui.dev/components/marketing/cards)
* [DaisyUI cards](https://daisyui.com/components/card/)