Brand Guide v2.0

Inzozi Solutions
Visual Identity

This guide defines how Inzozi Solutions looks, sounds, and behaves across every touchpoint. It shares its palette, type, and component language with register.rw, one visual family across both products. Follow it consistently, identity only works when applied the same way every time.

01 · Logo

The concept

The logo is a pure Plus Jakarta Sans wordmark — inzozi in the brand's own display typeface, set extrabold and lowercase. No separate symbol. The typeface itself is the identity.

The wordmark stays solid pine everywhere it appears. Leaf, the brand's action colour, is reserved for the standalone mark and for interactive elements, never blended into the wordmark itself.

The standalone mark is the lowercase “i”, the first letter of inzozi — rendered in Plus Jakarta Sans Extrabold in leaf. It scales from 10px (favicon) to any size.

Wordmark typeface: Plus Jakarta Sans 800 (extrabold)

Descriptor: IBM Plex Mono 400, uppercase, tracked wide

Mark:Plus Jakarta Sans 800 “i” in leaf (#1FA35C)

Minimum width: 80px for full wordmark

64px

32px

20px

12px

Full wordmark on light

inzozisolutions

Full wordmark on dark

Size range

Compact, tight spaces (mobile nav, app icons)

inzozi

Favicon, 32 × 32

32px

2× preview

Geometric interpretation of the “i” mark, dot and stem in leaf on pine. Generated via app/icon.tsx using Next.js ImageResponse. Served as /icon.png at 32×32.

Don'ts

Never set "inzozi" in italic, the wordmark is upright only

Never use all-caps, the wordmark is always lowercase

Never change the mark "i" to any colour other than leaf (#1FA35C)

Never add effects to the wordmark: no shadows, glows, outlines, or gradients

02 · Colour

Pine and paper, with leaf at work

Pine carries text and dark sections. Mint and Paper carry light sections. Leaf is the colour of doing something, buttons, links, checkmarks, so it appears wherever the product asks for an action. Lime appears in exactly one place: the chip inside a primary button.

Click any swatch or hex value to copy

Pine

--color-pine

Primary text and dark backgrounds: hero, footer nav, CTA bands.

Mint

--color-mint

Light section backgrounds, subtle tint bands.

Leaf

--color-leaf

Primary action colour: buttons, links, checkmarks, the logo mark.

Lime

--color-lime

Accent chip inside the arrow-button motif. Nowhere else.

Line

--color-line

Hairline borders, table dividers, on light backgrounds.

Paper

--color-paper

Cards, inputs, base page background.

Dim

--color-dim

Secondary text: Pine at roughly 75% opacity over Paper, for readability.

03 · Typography

Plus Jakarta Sans

Every typographic role

The only typeface in the system. Extrabold for display headings, bold for section headings, regular at reduced opacity of pine for body copy. Used in the logo wordmark too.

--font-sans

800 Display heading

Digital work, done right.

700 Section heading

We build things that last.

400 Body, 75% pine

We scope carefully before agreeing to anything. If we can't do it well, we say so.

IBM Plex Mono

Labels & data

Reserved for domain names, prices, dates, reading times, and metadata: section eyebrows, form labels, credentials. Always uppercase and tracked wide in labels. Never in running copy.

--font-mono

Section label

Services

Credential

DPO Certified · .rw Registrar · Kigali, Rwanda

Type scale

Hero clamp(2.5rem, 6.5vw, 7.5rem)We build things

Page H1, text-5xlWhat we offer

Section H2, text-2xlA process you can follow.

Item H3, text-lgWeb & App Development

Body, text-smWe scope carefully before agreeing to anything. If we cannot do it well, we say so rather than take the money and underdeliver.

Label, IBM Plex Mono 10pxDPO CERTIFIED · .RW REGISTRAR

04 · Voice

How we sound

Direct. Specific. Confident without needing to perform confidence. Like an experienced practitioner, not a startup pitching growth.

Specific over general

“We respond within 24 hours.”

“We respond quickly.”

Active over passive

“We scope the project before writing code.”

“Projects are scoped before code is written.”

Confident, not loud

“We build it once, properly.”

“We build the BEST digital products that will TRANSFORM your business!”

Name what happens

“Send message”

“Submit”

05 · UI Patterns

Buttons

On light

Primary action Secondary →

On dark

Primary action Secondary →

Primary actions are solid leaf pills with a lime arrow chip on the trailing edge, the brand's recurring forward-motion motif. The chip and pill shape work unchanged on light or dark backgrounds. Secondary actions stay plain text that brightens to leaf on hover.

Section anatomy

Section label

Row title one

Supporting description in plain, direct language.

Row title two

Supporting description in plain, direct language.

Imigongo band

A geometric triangle motif adapted from Rwanda's traditional imigongo wall art, rendered in brand tones. Used sparingly as a structural divider, currently only in the footer, above the copyright row. Never as scattered decoration.

06 · Spacing & layout

Page layout

Max content width: 72rem (max-w-6xl)

Horizontal padding: 1.5rem (px-6) / 2rem (lg:px-8)

Section vertical padding: 6rem (py-24)

Section label → content gap: 4rem (mb-16)

Row divider padding: 2.5rem (py-10)

Card / image corner radius: 0.75rem (rounded-xl)

Logo clear space

Minimum clear space: equal to the dot diameter on all four sides of the full wordmark.

For the dot mark alone: equal to half the dot diameter on all sides.

Never place text or graphic elements inside the clear space zone.

Inzozi SolutionsVisual Identity