Typography — Holistic Smart Brand System

Typographic Architecture

Our typography combines geometric modernity with rigorous enterprise legibility. Sourced directly from Google Fonts, each family serves a distinct structural purpose.

Display Headings

Outfit

Geometric, bold, architectural sans-serif for hero headlines, major section dividers, and stat numbers.

--ff-display: 'Outfit'

Body & Interface

Plus Jakarta Sans

Clean, highly legible European grotesk optimized for long-form reading, documentation, and web UI controls.

--ff-body: 'Plus Jakarta Sans'

Technical & Code

Space Mono

Engineering-grade monospace for design tokens, IP addresses, network port tables, and technical specs.

--ff-mono: 'Space Mono'

Primary Display: Outfit

Outfit brings bold geometric personality and crisp optical presence. Used exclusively for H1, H2, H3 headings, and large metric callouts.

Smarter Infrastructure.
Seamless Operations.

ABCDEFGHIJKLMNOPQRSTUVWXYZ
abcdefghijklmnopqrstuvwxyz
0123456789 — & @ # % $ / ( )

Medium 500

SemiBold 600

Bold 700 (Primary)

ExtraBold 800

Body & Interface: Plus Jakarta Sans

Plus Jakarta Sans provides high x-height and open letter apertures for effortless reading on both dense dashboard displays and mobile screens.

Intelligent Extra Low Voltage & Unified ICT Architecture

Modern commercial developments require tight synchronization between optical networking backbones, building automation controllers, and physical access systems. Holistic Smart bridges the gap between field infrastructure and software intelligence.

Regular 400 (Body)

Medium 500

SemiBold 600 (Subheads)

Bold 700 (Buttons & UI)

Technical Monospace: Space Mono

Space Mono conveys engineering rigor for technical values, token codes, port mappings, and timestamps.

System Configuration Specification

Space Mono 400 / 700

/* Network Topology & Fiber Uplink Profile */
INTERFACE  : 10G-SFP-UPLINK-01
PROTOCOL   : IEEE 802.3ae (10GBASE-LR)
IP_GATEWAY : 192.168.100.1 / 24
LATENCY    : < 0.42ms (Certified Core Backplane)
STATUS     : ONLINE_ACTIVE_SLA_99.999%

Typographic Scale Hierarchy

A harmonious type scale establishing consistent vertical hierarchy and cadence.

Level	Font Family	Size (Desktop / Mobile)	Weight	Line Height	Usage
Display Hero	Outfit	`54px / 38px`	Bold (700)	1.15	Landing page mastheads, main hero titles
Heading 1 (H1)	Outfit	`42px / 30px`	Bold (700)	1.2	Page titles, major division headings
Heading 2 (H2)	Outfit	`30px / 22px`	Bold (700)	1.25	Section titles within documentation and marketing
Heading 3 (H3)	Outfit	`20px / 18px`	SemiBold (600)	1.35	Card titles, subsection groupings
Lead Paragraph	Plus Jakarta Sans	`18px / 16.5px`	Regular (400)	1.65	Introductory paragraph beneath section titles
Base Body	Plus Jakarta Sans	`15px / 14.5px`	Regular (400)	1.6	Standard prose, documentation descriptions, table cells
Small / Caption	Plus Jakarta Sans	`13.5px / 13px`	Medium (500)	1.5	Footer links, metadata, card secondary notes
Overline / Eyebrow	Space Mono	`12px / 11px`	Bold (700)	1.0	Section category pills, uppercase tracking tags

Interactive Typography Playground

Test custom copywriting live across all three font families, adjust font size, and inspect rendering quality.

Font:

Weight:

Size: 36px

Smarter Infrastructure. Seamless Operations.

Typography Formatting Rules

Guidelines for clean typographic hierarchy and legibility.

ICT Network Infrastructure

Optical Fiber Backbone Deployment

High-density single-mode fiber installations engineered with zero-loss splice compliance.

Pair Outfit Display with Plus Jakarta Sans Body. Crisp heading contrast paired with open, comfortable body reading.

OPTICAL FIBER BACKBONE

High-density single-mode fiber installations engineered with zero-loss splice compliance.

Do not use Space Mono for long headlines or Outfit for small body copy. Keep each font strictly in its designated role.