Evolving our identity system

Below you'll find Nami's identity rules and guidelines in order to keep brand consistency across all channels and platforms.

Download Logo Pack
Happy subscribers using multiple devices
We’re on a mission to help app developers succeed in the modern App Economy.

Typography

When using fonts, there's a hierarchy for how the headings should work from H1 to H6. In order to be more flexible with content, there are also 3 styles for text that can be used as headings but without the <hX> tag to avoid interfering with SEO.

Heading 1

Heading 2

Heading 3

Heading 4

Heading 5
Heading 6
Text lg
Text md
Text sm

This is a paragraph example. Suspendisse varius enim in eros elementum tristique. Duis cursus, mi quis viverra ornare, eros dolor interdum nulla, ut commodo diam libero vitae erat.

Aenean faucibus nibh et justo cursus id rutrum lorem imperdiet. Nunc ut sem vitae risus tristique posuere.

This is a small paragraph. Suspendisse varius enim in eros elementum tristique. Duis cursus, mi quis viverra ornare, eros dolor interdum nulla, ut commodo diam libero vitae erat.

Aenean faucibus nibh et justo cursus id rutrum lorem imperdiet. Nunc ut sem vitae risus tristique posuere.

Brand colors

When using color across Nami's branding we should stick to this palette starting with the primary colors when possible.

Gradients should be used on specific cases such as wide backgrounds, hover effects and some assets (frames and icons).

We've added 3 complementary colors to create contrast and for when the primary colors cannot be applied, along with some neutral colors that should be used mainly for text.

Primary colors

Gradients

Complementary colors

Neutral colors

Iconography

Nami has a set of icons for 2 different scenarios.

The main icons are meant to be used for the main product and website, these should always be the first option.

There's a variation of some icons for the product pages that can be used when a smaller variation is required.

Download Icons
Happy faces for happy subscribersDevices iconSpeed arrow iconClouds iconTickets iconLock with a shield for security iconPie chart for analytics iconAbstract shapes to represent "Product"Abstract shapes to represent "Engineering"Little faces smiling iconTickets iconDevelopment iconPie chart icon