Design System
Visual Identity
& Architecture
Kyndof is not merely a fashion label; it is a womenswear engineering house.
We apply the rigor of software architecture and mechanical engineering to the drape, structure, and lifecycle of garments. Our visual identity must reflect this duality. It is precise yet elegant, systematic yet deeply human.
Every asset, color, and typographic choice is a deliberate component of a larger, scalable design system. The brand does not shout; it demonstrates quiet confidence through meticulous execution.
02. Logo System
Horizontal Wordmarks
Primary logo for navigation bars, headers, and wide formats.
Square / Profile Logomarks
Optimized for social media avatars, profile pictures, and square constraints.
Favicon / Micro
Strictly for browser tabs, app icons, and extreme small-scale usage (16px - 32px).
03. Clear Space & Size
Clear Space
To ensure legibility and impact, the logo must always be surrounded by a minimum clear space. This space is defined by the height of the lowercase "k" in the wordmark.
Minimum Size
To maintain resolution and legibility, the wordmark should never appear smaller than the dimensions specified below for print and digital applications.
80px25mm16px04. Incorrect Usage
The Kyndof logo must be used consistently to maintain brand integrity. Do not alter, distort, or modify the logo in any way. Below are examples of incorrect usage.
Incorrect Usage
Incorrect Usage
Incorrect Usage
Incorrect Usage
Incorrect Usage
Incorrect Usage
05. Color Architecture
Our color system is mapped directly to our CSS architecture. It relies on the stark contrast between Obsidian and Raw Silk to create structure, while semantic colors are applied strictly for functional feedback.
Foundation Palette
Obsidian
--color-bg-primaryPrimary Background / Base Structure
HEX
#0c080a
RGB
12, 8, 10
Raw Silk
--color-text-primaryPrimary Text / Light Backgrounds
HEX
#f4ece6
RGB
244, 236, 230
Rose Dust
--color-accentBrand Accent / Interactive Elements
HEX
#cda49f
RGB
205, 164, 159
Structural Palette
Carbon Thread
--color-surfaceElevated Surfaces / Cards / Modals
HEX
#1a1618
RGB
26, 22, 24
Pattern Paper
--color-text-secondarySecondary Text / Subdued Backgrounds
HEX
#e6ddd7
RGB
230, 221, 215
Steel Pin
--color-borderBorders / Dividers / Disabled States
HEX
#4a4548
RGB
74, 69, 72
Semantic & Feedback
Cochineal
--color-error
Destructive Actions / Errors (Red Dye)
Verdigris
--color-success
Validation / Success (Oxidized Copper)
Brass
--color-warning
Warnings / Pending States
06. Typography
Our typography system is strictly separated by language to ensure cultural and visual integrity. Select a language to view its specific typographic guidelines.
Playfair Display
Primary / Display / Headings
Weights: Light (300), Regular (400)
Style: Italic heavily favored
haute couture & deep tech.
Elegance is not standing out, but being remembered.
Inter
Secondary / Body / UI
Weights: Light (300), Regular (400), Medium (500)
Used for long-form reading, paragraphs, and functional UI elements. It provides clarity and modern neutrality against the expressive serif.
Kyndof is an engineering house dedicated to redefining womenswear through structural precision and material innovation.
JetBrains Mono
Numerals / Data / Code
Weights: Light (300), Regular (400)
Used for technical data, measurements, and precise numerical information to emphasize the engineering aspect of the brand.
0 1 2 3 4 5 6 7 8 9 & @ # % * ! ?
Micro-Typography & Scale
Display 1
Display 2
Heading 1
Body Large
Body Regular
Optical Margin Alignment
Punctuation marks (quotes, hyphens) should hang outside the text block to maintain a crisp, perfectly vertical edge for reading.
Language-Specific Rules
Arabic requires 15-20% more line height to accommodate complex ascenders. CJK fonts require slightly looser tracking than Latin characters.
07. Font Mixing Rules
The "Kyndof Typographic Equation" embraces the intentional mixing of Serif and Sans-serif to visually represent our duality: Haute Couture (Serif) and Deep Tech (Sans-serif).
Rule 01: Editorial Mixing
In Display and Headings, actively mix Sans-serif (uppercase) with Serif Italics (lowercase/capitalized) to create a striking, premium editorial look.
The Blueprint of Fashion
Correct (Display Mixing)
Rule 02: Body Text Emphasis
While body text is primarily Sans-serif for legibility, use Serif Italics (or Oblique) combined with the brand accent color to highlight key terms or concepts within a paragraph.
Kyndof is an engineering house.
Correct (Body Emphasis)
Rule 03: Universal Oblique
While traditional CJK typography avoids italics, Kyndof intentionally applies a precise mathematical slant (oblique) to non-Latin characters. This engineered approach ensures a unified, uncompromising visual identity across all global languages.
패션의 블루프린트.
Correct (Engineered Oblique)
08. Tone of Voice
Precise & Academic
We speak with the authority of engineers and the refinement of couturiers. Avoid hyperbole, marketing fluff, or overly emotional language. State facts, methodologies, and outcomes clearly.
"Engineered for structural longevity."
Uncompromising
Our tone reflects our standards. We do not apologize for complexity; we illuminate it. We respect our audience's intelligence and present our innovations with quiet, absolute confidence.
"The most beautiful dress you'll ever wear!"