From issue to resolution, documented.
Brand Guidelines & Identity System
01 — Logo
The ResolutionFlow logo combines the icon mark with the wordmark. Use the horizontal lockup as the primary logo in most applications.
Use on dark backgrounds (#09090b to #18181b)
Use on light backgrounds (#fafafa to #ffffff)
White version for gradient or colored backgrounds
Use when space is limited or brand is established
02 — Icon Anatomy
Every element of the icon has meaning, representing the core value proposition of ResolutionFlow.
Four filled circles represent the choices and decisions made during troubleshooting. Varying opacity shows frequency of use.
Solid lines represent common paths, dotted lines represent less frequent choices. Together they show the decision flow.
The glowing center node represents where all decisions converge into a single resolution. The glow emphasizes this focal point.
The bold arrow represents the final output — the automatically generated documentation that flows from the resolution.
03 — Color
A focused palette built around the indigo-to-violet gradient, supported by neutral dark tones.
Primary Gradient
Indigo
Violet
Background Dark
Surface
White
04 — Typography
Plus Jakarta Sans for headings and brand elements, Inter for body text and UI.
Display / Logo
Plus Jakarta Sans Bold
Font-weight: 700 • Letter-spacing: -0.03em
Headings
Plus Jakarta Sans Semibold
Font-weight: 600 • Letter-spacing: -0.02em
Body Text
Inter Regular & Medium
The quick brown fox jumps over the lazy dog. ResolutionFlow transforms chaotic technical troubleshooting into guided workflows with automatic documentation generation.
05 — App Icons
App icons at various sizes for different platforms and use cases.
06 — Usage
Guidelines for maintaining brand consistency across all applications.
Use the logo with adequate clear space around it
Don't change the logo colors
Use the icon alone when brand is established
Don't rotate or distort the logo
Use white version on gradient backgrounds
Don't reduce the logo opacity