Brand Guidelines
Color, typography, logo usage and voice for Cloud Invoice by Nexaus.
Brand Guidelines
Source of truth for representing Cloud Invoice, the open-source invoice manager by Nexaus. Use these guidelines to keep the brand consistent across the app, the docs site and any community material you produce.
Brand overview
- Full name: Cloud Invoice
- Short form / mark: nci
- Made by: Nexaus
- License: AGPL-3.0 (open source)
- Category: Invoice management, self-hosted
Use the full name Cloud Invoice on first mention and in headings. The nci
monogram is reserved for the app shell, favicons and tight lockups.
Logo
The mark is a document with the corner turned up — an invoice waiting to be opened and paid. It abstracts a page with a folded back and three ruled lines standing in for invoice line items.
Logo assets
Logos live in site/public/assets/logo/ and ship in two formats, each with a
vector SVG for screens and a raster PNG for print and email:
| Layout | Description |
|---|---|
shape | The standalone icon on a transparent background. |
square | The icon locked inside a rounded square tile. |
Colorways for each layout: teal, black, white. The PNG square mark also
ships with background treatments (teal-on-black, teal-on-white,
white-on-black, white-on-teal).
Logo preview
The mark in each layout and colorway:
| Layout | Teal | Black | White |
|---|---|---|---|
| shape |  |  |  |
| square |  |  |  |
Usage rules
- Keep clear space around the mark equal to the height of the icon on every side.
- Prefer the mark at a minimum display size of 32px; never go smaller in a digital product.
- Choose a colorway with enough contrast against its background (teal on light, white on dark).
Don'ts
Don't recolor, stretch, rotate or tilt the mark, and never add effects (shadows, gradients, outlines). Don't place it on a busy background. Never rearrange the three ruled lines or the cut corner.
Color
The palette is deliberately small so the brand stays distinct. The primary teal does the heavy lifting; black and white are the neutrals.
Brand palette
| Token | Usage | Value |
|---|---|---|
| Teal | Primary accent, brand | #0bb7ba |
| Dark teal | Text links, CTA and badge labels | #087786 |
| Black | Text, dark surfaces | #040404 |
| White | Light surfaces, inverted | #ffffff |
The teal is the same across the app's primary color and the logo. It reads calm and technical; use it for interactive accents (buttons, selected states) rather than large background fills, and reach for the dark teal for text.
Color on color
| Pairing | Usage |
|---|---|
| Dark teal on white | Text links, badge and CTA labels on light surfaces. |
| White on dark teal | Inverted CTA labels on a contrast-compliant teal. |
| Black on white | The default for body content and the docs. |
| White on black | Inverted surfaces, dark mode, dark footer. |
| Teal on white | Non-text accents only (icons, selected states). |
| White on teal | Non-text only: the brand mark on a teal tile. |
Ensure text meets a 4.5:1 contrast ratio against its background on web;
large display text can drop to 3:1. The primary teal (#0bb7ba) reaches only
about 2.5:1 on white, so never use it for text labels; use #087786 for
text on light, and white on #087786 for inverted labels.
Typography
The brand typeface is Inter (variable), used for both body and headings. It
ships as InterVariable.woff2 in the app (via next/font/local) and the docs
site.
- Headings: Inter Semibold to Bold (
600–700), tight tracking. - Body: Inter Regular (
400), relaxed leading. - Monospace (
font-mono): reserved for invoice numbers, document IDs and code samples so data stays legible at small sizes. - Fallbacks:
ui-sans-serif, system-ui, -apple-system, sans-serif.
Use a restrained type scale; let whitespace and weight signal hierarchy instead of color.
Voice
Write plainly and promise only what the product does.
- Short sentences, active voice, present tense.
- Prefer the second person ("you own your data") over the abstract.
- Nobody advertises inside user invoices, and neither do we — never add marketing or third-party messaging to the documents a user sends their clients.
- Technical accuracy beats marketing flourish; this is open source, so readers can verify every claim.
Naming
| Term | Rule |
|---|---|
| Cloud Invoice | Full name; first use in headings and text. |
| nci | Monogram; app shell, favicons, tight lockups. |
| Nexaus | The company behind the project (unaffiliated CTA is fine). |
Do and don't
Last updated on