> For the complete documentation index, see [llms.txt](https://docs.adena.app/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://docs.adena.app/resources/brand-assets/style-guide.md).

# Style Guide

### 1. Logo

The Signature Blue logo is used with a dark background by default to reflect our corporate principles being reliability and future-orientation. Using the Signature White logo is recommended for grayscale-toned websites.

![](/files/6Ht5sWV2i1QZZwV2pk5b)

Using the logo with square and circular backgrounds is allowed.

![](/files/HruZrJ2KQOFk7N6K2Ltc)

The Circular Type logo is used as the icon for the Chrome extension and mobile applications.

![](/files/FZ9qxGDxKMvbw4CKft9Q)

{% hint style="danger" %}
**Do not modify the logo!**

The Adena logo should not be altered in any way. Examples of prohibited use are:

* Distorting the logo
* Rotating the logo
* Changing the colors or gradations
* Changing the font of the Logotype area
* Using special effects
  {% endhint %}

### 2. Typeface

Poppins is the base font used throughout Adena's suite of products. Poppins is an open source font with a clean, modern style that reflects the streamlined web3 experience we aim to bring to our users.

![](/files/aCjPVgAV0DTkq92ml2SW)

### 3. Color Palette

The primary brand color of Adena is **Adena Blue**, represented in hex as **#0059FF**. In most cases, dark colors under the **Neutral** group are used for backgrounds with white colors under the same group as the font color. **Red** colors are used to present errors or failures; and the Green colors for successful actions and completion.

![](/files/IHpyo4dXHbUHHzL9PYxk)

Gradients or shadows are used to distinguish the components from backgrounds or to put an emphasis.

![](/files/t15oHYD4uvFYSV0c0FSf)

{% hint style="danger" %}
**Do not alter our primary brand color!**

Altering our primary brand color, **Adena Blue**, is strictly prohibited under any circumstances.
{% endhint %}

### 4. Icons

Icons serve as buttons, indicators, or inputs within our products.

![](/files/WWzV8SN6D4cKgpEbQyq7)