NexPatch Brand System, v1.0
Build. Deploy. Predict.
The official NexPatch design system. Every color, logo and token on this page is copy-paste ready: click any swatch or chip to put the exact value on your clipboard. The complete guide is also available as a single Markdown file.
01 · Identity
Logo
The NX circuit monogram sits inside a hexagonal outline. Logo artwork is always #EA4D20, white, or black.
- Logo orange is #EA4D20. Never recolor the mark with UI accent tones like #ffb59e.
- Minimum size: icon 24 px, wordmark 120 px wide. Print: icon 8 mm, wordmark 30 mm.
- Clear space: keep roughly 25 percent of the mark's height free on all sides.
- No effects: no glows, gradients, outlines, shadows or rotation on the logo.
02 · Palette
Colors
Dark-first, Material 3 tonal logic, warm orange primary. One dominant accent per composition: orange, blue and purple never share equal weight. Click any swatch to copy its value.
Surfaces
Text
Accents
Semantic + Borders
Light variant (print + handouts)
:root {
/* surfaces */
--color-nxp-bg: #131313;
--color-nxp-bg-mid: #1c1b1b;
--color-nxp-card: #201f1f;
--color-nxp-card-hover: #2a2a2a;
--color-nxp-surface-highest: #353534;
--color-nxp-surface-lowest: #0e0e0e;
/* text */
--color-nxp-fg: #e5e2e1;
--color-nxp-fg-variant: #e6beb2;
--color-nxp-muted-fg: #ad897e;
/* accents */
--color-nxp-primary: #ffb59e;
--color-nxp-primary-glow: #ffdbd0;
--color-nxp-primary-container: #ff571a;
--color-nxp-on-primary: #5e1700;
--color-nxp-secondary: #b1c5ff;
--color-nxp-secondary-container: #0559d4;
--color-nxp-tertiary: #c7bfff;
--color-nxp-tertiary-container: #8f7fff;
/* semantic */
--color-nxp-success: #22c55e;
--color-nxp-warning: #f59e0b;
--color-nxp-destructive: #ffb4ab;
/* borders */
--color-nxp-border: rgba(255,255,255,0.05);
--color-nxp-border-strong: rgba(255,255,255,0.1);
--color-nxp-outline: #ad897e;
}03 · Typography
Type system
Three faces, three jobs. Space Grotesk speaks, Inter explains, JetBrains Mono annotates.
· 500 / 600 / 700
Forecasting that survives real-world complexity
· 400 / 500
We design intelligent systems that help forward-thinking enterprises scale with confidence.
· 400 / 500
Private Deployment · Forecast System
04 · Space and surface
Layout, radius, depth
Near-square corners, hairline borders, and depth from glow rather than shadow. Click a tile to copy its value.
05 · Language
Voice and tone
Precise, technical, calm. We explain systems, we do not hype them.
Approved
- Private AI for real operations.
- Forecasting that survives real-world complexity.
- Build once. Deploy securely. Scale deliberately.
- From data chaos to decisions.
- Von Datenchaos zu belastbaren Entscheidungen.
Banned
- Revolutionize your business today
- Unlock next-level AI magic
- We are your innovative partner for success
If a sentence could sit on any agency website, rewrite it until it could only be ours.
06 · Files
Asset index
All paths are relative to https://nexpatch.ai.
| Asset | Path | URL |
|---|---|---|
| Logo, all variants | /assets/logo/{svg,png}/{full-color,white,black}/ | |
| Favicon | /favicon.svg | |
| OG / share image | /og-image.png | |
| Social profile images | /assets/social-media/ | |
| Technology icons | /assets/images/technologies/ | |
| Case study logos | /assets/images/case-studies/ | |
| Team portraits | /assets/images/team-member/ | |
| Machine-readable guide | /design.md |
For AI agents
Building something with the NexPatch brand? The complete design system is machine-readable at these endpoints: /design.md · /llms.txt