Corporate Design & Brand Assets
The VisiTrans brand family spans four products, each with its own logo, tagline, and module variants. All toolkit skills that generate branded output (documents, presentations, prototypes) resolve logos and colors through a centralized system.
Brand Family
| Brand |
Tagline |
Modules |
| VisiTrans |
THE LOGISTIC DIGITIZER |
Parent brand (no modules) |
| VisiMatch |
SMART LOGISTICS |
Carrier, Pricing, Terminal |
| VisiFair |
SMART FAIRGROUNDS |
Planner, Marker, Outdoor, Guide, Data, Show |
| VisiArea |
SMART ACCESS |
Defense |
Logo Usage
Asset Resolution
All skills resolve logos via the BRAND_ASSETS_ROOT path variable (defined in CLAUDE.md):
BRAND_ASSETS_ROOT = TOOLKIT_ROOT/plugins/core-standards/skills/visitrans_cd/assets/
= ~/.claude/skills/vt-c-visitrans-cd/assets/ (via symlink)
| Use Case |
Path |
Format |
| Document generation (PDF/Word) |
BRAND_ASSETS_ROOT/logos/[Product].jpg |
JPG |
| Web prototypes (Angular/React) |
ONEDRIVE_ROOT/03-Corporate Design/01-Logos/[NN-Brand]/01-Web-logos/ |
PNG |
| Print production |
ONEDRIVE_ROOT/03-Corporate Design/01-Logos/[NN-Brand]/02-print-logos/ |
PDF |
| Master/source files |
ONEDRIVE_ROOT/03-Corporate Design/01-Logos/01-Basisdateien/ |
AI |
Local Logo Inventory (13 files)
Primary logos (4):
VisiTrans.jpg, VisiMatch.jpg, VisiFair.jpg, VisiArea.jpg
Module logos (9):
VisiMatch_Carrier.jpg, VisiMatch_Pricing.jpg, VisiMatch_Terminal.jpg,
VisiFair_Planner.jpg, VisiFair_Marker.jpg, VisiFair_Outdoor.jpg,
VisiFair_Guide.jpg, VisiFair_Data.jpg, VisiFair_Show.jpg,
VisiArea_Defense.jpg
OneDrive Master Source
ONEDRIVE_ROOT/03-Corporate Design/01-Logos/
02-VisiTrans/ 01-Web-logos/ (PNG) 02-print-logos/ (PDF)
03-VisiMatch/ 01-Web-logos/ (PNG) 02-print-logos/ (PDF) 03-favicon/
04-VisiFair/ 01-Web-logos/ (PNG) 02-print-logos/ (PDF) 03-favicons/
05-VisiArea/ 01-Web-logos/ (PNG) 02-print-logos/ (PDF)
Logo Selection Logic
- Check document title/content for a product name
- If "VisiMatch" in title →
VisiMatch.jpg
- If "VisiFair" in title →
VisiFair.jpg
- If "VisiArea" in title →
VisiArea.jpg
- If a specific module is the focus (e.g., "Terminal") → use module logo (
VisiMatch_Terminal.jpg)
- Default →
VisiTrans.jpg
Logo Variants by Background
| Background |
Logo Colors |
| White |
Orange + Black (standard) |
| Black |
Orange + White |
| Orange |
Black + White |
| Light gray |
Orange + Gray or Orange + Black |
| Dark image |
Orange + White |
| Light image |
Orange + Black |
Minimum Sizes
- Print: 20mm width minimum
- Digital: 120px width minimum
- Favicon: 32x32px minimum
- Clear space: Height of the letter "i" in the logo on all sides
Color Palette
Primary Colors (0% tolerance in logos)
| Color |
HEX |
RGB |
CMYK |
Usage |
| Orange |
#FC9E00 |
252, 158, 0 |
0, 38, 100, 0 |
Logo highlight, CTAs, accents |
| Black |
#000000 |
0, 0, 0 |
0, 0, 0, 100 |
Logo base, body text, headlines |
| White |
#FFFFFF |
255, 255, 255 |
0, 0, 0, 0 |
Backgrounds, reversed text |
Extended Colors
| Color |
HEX |
Usage |
| Dark Blue |
#3F51B5 |
Text, infographics |
| Yellow |
#FFEB3B |
Highlights |
| Magenta |
#9C27B0 |
Accents |
| Light Green |
#B2FF59 |
Accents |
| Petrol |
#00697C |
Infographics |
| Red |
#D32F2F |
Warnings, alerts |
Color Tolerance Rules
| Level |
Tolerance |
Applies To |
| Critical |
0% |
Primary colors in logos |
| Strict |
±5% |
Primary colors in headlines/CTAs |
| Normal |
±10% |
Secondary and extended colors |
| Recommendation |
±15% |
Background colors |
Typography
Document & Print
| Role |
Font |
Fallback |
| Logo / Product names |
Futura Bold |
Avenir Next Bold, Montserrat Bold |
| Product descriptions |
Futura Book |
Avenir Next Regular |
| Headlines (strong) |
Frutiger 77 Black Condensed |
Helvetica Neue Condensed Bold |
| Headlines (standard) |
Frutiger 67 Bold Condensed |
Helvetica Neue Condensed |
| Body text |
Frutiger 57 Condensed |
Univers, Arial |
| Light text |
Frutiger 47 Light Condensed |
Helvetica Neue Light |
Web & UI
| Role |
Font |
Weight |
| All UI text |
Inter |
100-900 (variable) |
| Fallback |
system sans-serif |
— |
Framework Implementation
The /vt-c-visitrans-design-system skill generates framework-specific design token implementations:
- Angular + PrimeNG: Generates
vt-preset.ts with brand colors, typography, and component theme overrides
- CSS Variables: Generates
vt-variables.css for framework-agnostic usage
Run /vt-c-visitrans-design-system --init in a project to generate the appropriate configuration. See the skill documentation for component templates and validation.
Skills Using Brand Assets
| Skill |
Uses |
Resolution |
/vt-c-visitrans-cd |
Logos, colors, typography |
BRAND_ASSETS_ROOT/logos/ (local) |
/vt-c-document-converter-branded |
Logos in PDF/Word headers |
BRAND_ASSETS_ROOT/logos/ |
/vt-c-meeting-minutes |
Logos in branded minutes |
BRAND_ASSETS_ROOT/logos/ |
/vt-c-mermaid-diagrams-branded |
Brand color themes |
Color values (no logo files) |
/vt-c-pd-3-prototype |
Logo in scaffold, CD tokens |
BRAND_ASSETS_ROOT + ONEDRIVE_ROOT for CD manual |
/vt-c-kw-prototype |
Logo in scaffold, CD tokens |
Same as pd-3-prototype |
/vt-c-gamma-presentation |
Brand color hints in AI prompts |
Color references (no logo files) |
Verification
setup.sh --verify checks that all 4 primary brand logos are present in BRAND_ASSETS_ROOT/logos//vt-c-visitrans-cd audits documents for CD compliance (colors, typography, logo usage)/vt-c-visitrans-design-system --validate checks prototype CD compliance
- Security Governance — includes hook-based enforcement of design standards
/vt-c-visitrans-cd SKILL.md — full CD rules, logo variants, audit workflow/vt-c-visitrans-design-system SKILL.md — framework-specific token generation and component templates