Master Brand Identity System

Engineering Identity.
Building Scalable Futures.

The definitive brand guidelines for Vylex Technologies. Tailored standards for building web pages, engineering software products, and designing creative marketing assets.

Version
2.0 Master
Updated
2026
Entity
Vylex Technologies
Focus
Web · Software · Creative
01 — Guidance Pillars

How Are You Working With Vylex Today?

Choose your exact workflow below to get explicit, step-by-step guidance tailored specifically to your project requirements.

Web Development

Website & Page Building

Building new landing pages, updating existing sections, or adding components to vylex.co.za.

  • Standard HTML5 & CSS structure
  • Header, Footer & Nav integration
  • Pre-built Tailwind utility classes
  • SEO & WCAG AA accessibility specs
Open Website Guide
Software Engineering

Projects & SaaS Products

Designing UI dashboards, building web apps, custom client tools, micro-services, and enterprise platforms.

  • Design Tokens & CSS Variables
  • Data tables, inputs & form states
  • Status badges & system alerts
  • Motion curves & UX micro-copy
Open Project Guide
Creative & Design

Creative & Social Media

Creating social posts (LinkedIn, Instagram, X), promotional banners, QR codes, print media, or pitch decks.

  • Social post layout blueprints
  • 1:1, 4:5, 16:9 aspect ratio specs
  • Branded QR Code generator rules
  • Vector assets & export standards
Open Creative Guide
02 — Logo System

Logomark & Wordmark Rules

The Vylex logo combines a geometric "V" icon with a clean, lowercase wordmark and an orange full-stop signature (.).

vylex.
Primary LockupLight BG
vylex.
Reverse LockupNavy BG
vylex.
On Brand OrangeOrange BG
Standalone MarkIcon / Favicon
03 — Palette & Contrast

Color Harmony

Vylex Navy anchors our technology products in authority, while Vylex Orange injects energy into critical CTAs and highlights.

#051B38
Vylex Navy
Primary brand anchor, headers, hero backgrounds, high contrast text.
#FBA919
Vylex Orange
Primary CTAs, active highlights, key brand accents, logo full-stop.
#0A2E5C
Light Navy
Secondary dark surfaces, card borders in dark mode, hover states.
#E2E8F0
Slate Gray
Borders, light section dividers, input outlines, subtle frames.
04 — Typography

Type Scale

We pair DM Sans for human warmth and readability with Fira Code for modern technical clarity.

Display Heading
DM Sans 800 · 40px
Engineered for Scale.
Section Title
DM Sans 700 · 26px
Custom Business Systems & Software
Body Text
DM Sans 400 · 16px · 1.65 line-height
Vylex Technologies builds custom enterprise software, workflow automation, and vertical SaaS solutions designed to optimize operations and drive sustainable growth.
Monospace / Code
Fira Code 500 · 14px
const systemState = await vylex.initialize({ mode: 'production' });
05 — Brand Voice

Tone & Messaging Principles

1. Authoritative & Direct

We state facts without fluff. Focus on clear ROI, performance numbers, and concrete technological advantages.

2. Modern & Futuristic

Use clean software and architectural terminology. Avoid outdated jargon or overly casual slang.

3. Human-Centric & Helpful

Even in technical contexts, frame features around solving real business pain points and saving human effort.

06 — Brand Integrity

Logo Clear Space & Misuse Rules

Always maintain brand integrity. Never alter logo proportions, recolor using unapproved shades, or place on clashing backgrounds.

✓ Approved — Clear Space
vylex.
✕ Unapproved — Recolor
vylex.
✕ Unapproved — Distort
vylex.