# Corner Radii

> Corder / border radii help us express our warm, friendly and approachable brand persona.

Determining the appropriate corner radii value is an important step when expressing our brand. Note the following:

* Too small a value can make an object seem harsh to the eye.  
* Sharp or square edges are generally NOT a part of the CoinGecko brand.
* Excessively rounded objects on the other hand, don’t feel cohesive with the larger layout and composition.

To ensure that any component or visual object is expressed in a consistent manner, we recommend using the following values for rounded/round objects depending on their relative size on the canvas.

## Rounded Applications

For rounded applications, take note of the scale & size of the object. Use the guide below to help determine the appropriate values for the container/object you are creating.

<figure><img src="https://3936590801-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FuBDUa2ODcAkHHV15nEGc%2Fuploads%2Fzihgvz5EMP9pVRAbSc9t%2FRounded%20Radii.png?alt=media&#x26;token=06bc6c19-2a8e-4e87-a302-6ca25f7b9978" alt=""><figcaption><p>Rounded radii</p></figcaption></figure>

{% hint style="info" %}
You may use border radii up to `24px` in rounded applications.
{% endhint %}

{% hint style="warning" %}
Avoid border radii > `24px` for rounded applications
{% endhint %}

***

## Round Application

We use full-round border / corner radii in some UI applications instances. E.g. Pill components.&#x20;

<figure><img src="https://3936590801-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FuBDUa2ODcAkHHV15nEGc%2Fuploads%2FgW4gww0Gjfy0CoRy4XoT%2FRound%20Radii.png?alt=media&#x26;token=4fe55001-b405-46d7-ab9c-7604777503a0" alt=""><figcaption><p>Round radii</p></figcaption></figure>
