brand guidelines

our brand. use it right.

logos, colors, typography, and usage guidelines. everything you need to represent maxiphy consistently across any medium.

01 — logo

logo variants

three logo types for different contexts. toggle between dark/light and colored/monochrome to preview.

maxiphy | UX driven software

marketing

marketing logo

used on the website header, social profiles, and marketing material.

maxiphy

base

base logo

the primary maxiphy wordmark with logomark. use this in most contexts.

maxiphy solutions SARL

legal

legal logo

used on invoices, contracts, and official documents.

02 — guidelines

logo guidelines

construction rules, the pipe pattern, and usage do's and don'ts.

construction

maxiphy logo construction diagram showing logomark dimensions, spacing, and safe area

rules

  • logomark is a square: 1u x 1u
  • logomark height equals the wordmark font size
  • gap between mark and wordmark is 0.5u
  • letter cap-height aligns with mark top edge
  • letter descenders align with mark bottom edge
  • minimum safe area of 1u on all sides

the pipe pattern

"maxiphy" is always font-black. the pipe and section name are always font-light. exception: the legal name does not use a pipe.

maxiphy | UX driven softwarewebsite header, marketing
maxiphy | sprintssprint material
maxiphy | systemssystems material

do

  • Use the colored-on-dark logo on dark backgrounds (preferred)
  • Maintain clear space equal to the height of the mark on all sides
  • Use SVG for web and digital, PNG for print and presentations
  • Use monochrome white over photography or color

don't

  • Recolor the logo mark
  • Stretch, rotate, or distort the logo
  • Add drop shadows, strokes, or gradients
  • Place the light variant on dark backgrounds (or vice versa)
  • Recreate the wordmark in a different typeface

03 — colors

color system

our palette is built for dark interfaces. every color has a defined role. tap the copy icon on any swatch to copy the hex.

Brand Hues

maxiphy Blue

#008DC1

Primary brand color — logo mark, links, accents, CTAs

Dev Green

#34C186

Development service accent

Marketing Yellow

#FFA216

Marketing service accent

UI/UX Red

#E01C4B

UI/UX sprint service accent

Branding Violet

#9636F6

Graphic design & branding service accent

Neutrals

Black

#000000

Page background, dark text on light surfaces

Grey 700

#4B5563

Borders, dividers, disabled states

Grey 600

#6B7280

Muted text, captions

Grey 400

#D1D5DB

Secondary text

White

#FFFFFF

Headings, body text, backgrounds

04 — typography

type system

Urbanist is our sole typeface. five weights: 300 (light), 400 (regular), 500 (medium), 700 (bold), and 900 (black).

typeface

Urbanist

Light 300Regular 400Medium 500Bold 700Black 900

Aa Bb Cc Dd Ee Ff Gg Hh Ii Jj Kk Ll Mm Nn Oo Pp Qq Rr Ss Tt Uu Vv Ww Xx Yy Zz

0 1 2 3 4 5 6 7 8 9 ! @ # $ % & * ( ) + = ? / . , ;

get Urbanist on Google Fonts

type scale

Display68px / 900

maxiphy

H156px / 900

products we built

H240px / 900

our approach

H328px / 900

the design system

H422px / 700

discovery week

Body Large20px / 300

every project starts with a real problem.

Body16px / 300

we design products that work before writing a single line of code.

Small14px / 300

case study, 6 min read, Beirut, Lebanon

Caption12px / 300

WRITTEN BY

branding sprint

want a brand this intentional?

every color, every weight, every spacing rule on this page was designed in a 15-day branding sprint. we can do the same for your company. logo, color system, typography, and a full brand guidelines document, ready to use.

explore the branding sprint