> For the complete documentation index, see [llms.txt](https://help.fluorescent.co/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://help.fluorescent.co/stiletto/readme/stiletto-6.0-visual-refresh/corner-rounding.md).

# Corner rounding

New corner radius controls for 10+ theme elements

Use the **Corner radius** settings to change the roundness of elements across your site — including images, inputs, buttons, drawers, and popups.

<div><figure><img src="https://2417329470-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2Fhnqe0uck0ozZhJ77wGXt%2Fuploads%2FQVo5XOx96TZl6pO6e41F%2Fmulti-column-corner-radius.png?alt=media&amp;token=c36f9917-62d8-4456-a695-fa7ed62b5992" alt=""><figcaption><p>Rounded multi-column items and button</p></figcaption></figure> <figure><img src="https://2417329470-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2Fhnqe0uck0ozZhJ77wGXt%2Fuploads%2FENDuivTMkC8T2EtfaedC%2Fproduct-listing-corner-radius.png?alt=media&amp;token=24cb8a2a-dc3f-478d-8321-f19f22d5b70f" alt=""><figcaption><p>Rounded product images, button, and chips</p></figcaption></figure></div>

#### <mark style="color:$primary;">Available corner radius options</mark>

Go to *Theme settings > Corner rounding* to find radius settings for different elements. You'll find options to toggle on or off corner rounding in some sections and the image block.

<table data-header-hidden data-full-width="false"><thead><tr><th></th><th></th><th></th></tr></thead><tbody><tr><td><strong>Drawers and modals</strong></td><td><strong>Popovers</strong></td><td><strong>Smalls cards and containers</strong></td></tr><tr><td><strong>Cards and images</strong></td><td><strong>Image thumbnails</strong></td><td><strong>Form inputs</strong></td></tr><tr><td><strong>Swatches</strong></td><td><strong>Top bar filters</strong></td><td><strong>Checkbox</strong></td></tr><tr><td><strong>Text areas (long text)</strong></td><td><strong>Buttons</strong></td><td><strong>Badges</strong></td></tr></tbody></table>

***

<mark style="color:$info;">**Note the change**</mark>

{% hint style="info" %}

#### Swatch shape

The **Button corner radius** setting replaces the 'Round' option previously under *Theme settings > Swatches.*
{% endhint %}
