Brand Guidelines

This manual covers logo construction, typeface usage, and consistent application of brand colors, so the YourOptions identity is represented accurately across every form of communication.

Rather than limiting creativity, it exists to unlock ways of expressing the brand's essence. Every element has a distinct purpose, but the real impact comes from their combined use.

Three wireframe cubes lock together into a Y. Open shapes rather than solid ones — a platform built on visible process, not hidden formulas.

Each cube is one step in the learning path. The three arrows are the choices every investor makes, and together they spell Your Options.

The safe zone is measured from the symbol — three quarters of the symbol's width, held clear on every side.

Because the unit comes from the mark itself, the safe zone scales with the logo. Set any width and it follows.

The logo's proportions are built on composition, hierarchy, and function. Proportions, dimensions, and brand colors must never be altered.

Every example below is the live logo, deformed in the browser — so these stay accurate as the asset itself changes.

The palette carries the brand's personality. These four colors are the whole system — anything outside them is off-brand.

Click any value to copy it, or take the whole set as tokens for CSS, SCSS, JSON, and Swift.

Accessible is the first brand value, so it has to hold up in practice. Every palette pair, measured against WCAG 2.1.

Body text needs 4.5:1; large text — 24px up, or 19px bold — needs 3:1. Lime never carries copy on a light ground.

Host Grotesk sets headlines and display type. Inter carries paragraphs, UI, and supporting content.

Both are open-licensed, so they are free to embed in any product or campaign without a licence fee.

The pattern comes straight out of the logo — the cube, tessellated. No strict rules on positioning or rotation.

The one rule is to stay inside the brand color combinations. Build one here and take it with you.

Every type in every brand color — vector for print and web, PNG for anywhere that will not take SVG.

Take one file from a card, or the whole library in a single archive: logos, PNGs, tokens, and favicons.