Brand Identity System
INTELeTech
A comprehensive guide to the Variant D visual identity, including color psychology, demographic targeting, and UI application.
1. Primary Logo Environments
Light Mode Application
Dark Mode Application
*Note: In dark environments, the deep Navy (#163B72) blends smoothly into the dark background, pushing the visual focus heavily onto the vibrant Magenta (#ae005f) "eTech".
Monogram Marks (IT)
The primary abbreviated mark used for app icons and browser favicons when the full wordmark is too large.
Light Tab Favicon
Dark Tab Favicon
App Icon / Social Avatar
Symbolic Icon Marks (The Abstract Iris)
The "Abstract Iris" acts as a predictive lens. The off-axis, asymmetrical orbital rings (Navy) represent dynamic data processing and complex systems coming together. The sharp, angular pupil (Magenta) glowing in the center symbolizes the AI-driven insights—the ability to see patterns and futures that others miss.
Light Tab Symbol
Dark Tab Symbol
Icon Only App / Social
2. Brand Psychology & Target Demographics
Deep Navy (#163B72)
Meaning: Trust, corporate stability, intelligence, security, and authority. Navy is the anchor of the tech and finance industries. It communicates to the user: "Your data is safe, and we are established professionals."
Vibrant Magenta (#ae005f)
Meaning: Innovation, disruption, forward-thinking energy, and passion. Magenta breaks the traditional "boring corporate" mold. It communicates: "We are cutting-edge, modern, and boldly pushing boundaries."
Target Demographics
- Age Range: 25 – 55 years old.
- Primary Audiences: Tech professionals, B2B decision-makers, agency creatives, and startup founders.
- Socioeconomic: Mid-to-high income; highly educated; comfortable with modern SaaS platforms.
The Brand Persona
"The Established Innovator"
This color combination perfectly bridges the gap between generations. The Navy builds immediate trust with older, traditional corporate clients (Gen X, Boomers), while the Magenta signals dynamic, modern software capabilities that attract younger founders and developers (Millennials, Gen Z).
3. Extended UI Color Palette
Core Brand Colors
Brand Navy
HEX #163B72
RGB 22, 59, 114
Brand Magenta
HEX #ae005f
RGB 174, 0, 95
Digital Cyan (Accent)
HEX #00E5FF
Action / Highlight
Brand Gradient
135deg Blend
Deep Color Palette (Tints & Shades)
Extended ranges for backgrounds, borders, hover states, and layered UI depth.
Navy Scale
Magenta Scale
Tuned Semantic Accents
These colors have been expertly adjusted to complement your Brand Navy and Magenta. Specifically, Error has been shifted to a warm red to avoid confusion with Brand Magenta.
Info
#00E5FF (Brand Cyan)
Success
#00C48C (Teal/Mint)
Warning
#FFB020 (Golden Amber)
Error
#FF3B30 (Warm Alert Red)
4. Typography & Base Elements
Typography & Hierarchy
Heading 1 (Brand Navy)
The Future of Tech
Heading 2 (Slate 900)
Streamline your workflow
Body Text (Slate 600) with Inline Link (Magenta)
We provide enterprise-grade security and analytics. Our new platform leverages AI to automate complex processes. Read the documentation to learn more.
Interactive Elements
Magenta base (#ae005f) / Hover (#87004A)
Navy text/border (#163B72) / Hover bg (#F0F4F8)
Brand Gradient / Hover (opacity drop)
Digital Cyan (#00E5FF) used heavily in dark mode
5. Light & Dark Mode UI Patterns
Examples of how to utilize the primary colors, tints/shades, and semantic accents together in complex, real-world components for both modes.
A. Dashboard Metric Card
Total Revenue
Past 30 DaysTotal Revenue
Past 30 DaysB. System Alert (Using tuned Error color)
Payment Failed
We couldn't process your last transaction. Please update your billing method to continue using INTELeTech Pro.
Payment Failed
We couldn't process your last transaction. Please update your billing method to continue using INTELeTech Pro.
C. Feature Highlight / CTA Card
AI-Powered Insights
Let our new predictive models analyze your dataset in real-time. Uncover trends you didn't know existed.
AI-Powered Insights
Let our new predictive models analyze your dataset in real-time. Uncover trends you didn't know existed.
D. Comprehensive Semantic States (Notifications)
How to strictly apply Info, Success, Warning, and Error colors across system messages.
Light Mode Applications
Info: Update Available
Version 2.4 is ready to install.
Success: Data Exported
Your CSV file has been saved to your local drive.
Warning: High Usage
You have consumed 90% of your monthly API limits.
Error: Connection Lost
We could not reach the server. Please try again.
Dark Mode Applications
Info: Update Available
Version 2.4 is ready to install.
Success: Data Exported
Your CSV file has been saved to your local drive.
Warning: High Usage
You have consumed 90% of your monthly API limits.
Error: Connection Lost
We could not reach the server. Please try again.