Brand Guidelines 2026
AI-Native Content Intelligence Platform

Brand Portal
& Design System

Built for teams and partners — a complete reference to work with the Tenovos brand without the back-and-forth. Logos, colors, typography, icons, voice guidelines, and copyable design tokens, all in one place.

Explore System
10
Sections
16+
Color Tokens
Inter
Typeface
3
Logo Formats
WCAG
AA+ Ready
01 — Logo System
The Tenovos Mark

Three dynamic elements forming a forward-moving symbol of momentum — paired with the "tenovos." wordmark in Inter Medium. Download all formats below.

Primary — White on Navy
Default. Use on #1F2643 or any dark surface.
Secondary — Dark on White
Use on #FFFFFF or #F4F6FA. Print and light-mode contexts.
On Off-White — Dark
Alternative light surface. Documents, presentations.
Icon Mark — Standalone
Favicons, app icons, avatars, compact spaces.
Tenovos Glass — Legacy Logo
Glass product brand. Concentric circle mark + "glass" wordmark. Use for Glass-specific contexts only.
✓
Do
  • White logo on Navy #1F2643 or dark backgrounds
  • Dark logo on White #FFFFFF or Off-White #F4F6FA
  • Maintain clear space = icon mark height on all sides
  • Scale proportionally — SVG for digital, AI/EPS for print
  • Use icon mark standalone in compact spaces
  • Minimum digital size: 120px wide
✕
Don't
  • Place on busy or photographic backgrounds
  • Rotate, stretch, distort, or flip the logo
  • Apply shadows, outlines, or visual effects
  • Use at reduced opacity or alter colors
  • Recreate the wordmark in any other typeface
  • Combine with other logos without brand approval
  • Change the icon mark size independently — the icon and wordmark always scale together as one unit
02 — Color System
Brand Palette

Every color ships with a full 50–950 shade scale, WCAG accessibility contrast ratios against white and navy, hex/RGB/HSL values, and CSS variables. Click any swatch to copy the hex value.

Navy
#1F2643
HEX#1F2643
RGB31, 38, 67
HSL228°, 37%, 19%
CSS--tnv-navy
Contrast ∕ White14.8:1 AAA
Contrast ∕ Navy1.0:1 Fail
RolePrimary background · Hero sections · Dominant surfaces
50 #EFF0F5 Fail AAA
100 #D4D7E5 Fail AAA
200 #9CA5C8 Fail AA
300 #6270AC AA AA*
400 #3D497B AAA Fail
●
500 #1F2643 AAA Fail
600 #1A2039 AAA Fail
700 #151A2F AAA Fail
800 #101425 AAA Fail
900 #0B0E1B AAA Fail
950 #090B16 AAA Fail
Secondary Blue
#2E56A9
HEX#2E56A9
RGB46, 86, 169
HSL220°, 57%, 42%
CSS--tnv-blue
Contrast ∕ White7.0:1 AA
Contrast ∕ Navy2.1:1 Fail
RoleButtons · Interactive elements · Supporting UI
50 #EEF1F7 Fail AAA
100 #D8DFEE Fail AAA
200 #ACBCDF Fail AAA
300 #7D99D2 Fail AA
400 #4B74C7 AA AA*
●
500 #2E56A9 AA Fail
600 #24458A AAA Fail
700 #1B356A AAA Fail
800 #12244A AAA Fail
900 #0A1429 AAA Fail
950 #060C19 AAA Fail
Highlight Blue
#7AA5FF
HEX#7AA5FF
RGB122, 165, 255
HSL221°, 100%, 74%
CSS--tnv-highlight
Contrast ∕ White2.4:1 Fail
Contrast ∕ Navy6.1:1 AA
RoleAccent words · Links · CTAs · Decorative highlights
50 #EAEFFB Fail AAA
100 #DFE8F9 Fail AAA
200 #C9D8F8 Fail AAA
300 #B0C8F8 Fail AAA
400 #96B7FB Fail AAA
●
500 #7AA5FF Fail AA
600 #2D71FF AA* AA*
700 #0048DF AAA Fail
800 #002F92 AAA Fail
900 #001645 AAA Fail
950 #000A1F AAA Fail
Dark Gray
#333333
HEX#333333
RGB51, 51, 51
HSL0°, 0%, 20%
CSS--tnv-dark
Contrast ∕ White12.6:1 AAA
Contrast ∕ Navy1.2:1 Fail
RoleBody text on white · WCAG AAA compliant
50 #F2F2F2 Fail AAA
100 #DDDDDD Fail AAA
200 #B2B2B2 Fail AA
300 #888888 AA* AA*
400 #5E5E5E AA Fail
●
500 #333333 AAA Fail
600 #2C2A2A AAA Fail
700 #252222 AAA Fail
800 #1D1919 AAA Fail
900 #151212 AAA Fail
950 #110E0E AAA Fail
Off-White
#F4F6FA
HEX#F4F6FA
RGB244, 246, 250
HSL220°, 37%, 97%
CSS--tnv-offwhite
Contrast ∕ White1.1:1 Fail
Contrast ∕ Navy13.7:1 AAA
RoleLight backgrounds · Alternate surfaces
50 #EFF1F5 Fail AAA
100 #F0F2F6 Fail AAA
200 #F1F3F7 Fail AAA
300 #F2F4F8 Fail AAA
400 #F3F5F9 Fail AAA
●
500 #F4F6FA Fail AAA
600 #ACBCDB Fail AAA
700 #6381BD AA* AA*
800 #365083 AAA Fail
900 #17233B AAA Fail
950 #090D16 AAA Fail
White
#FFFFFF
HEX#FFFFFF
RGB255, 255, 255
HSL0°, 0%, 100%
CSS--tnv-white
Contrast ∕ White1.0:1 Fail
Contrast ∕ Navy14.8:1 AAA
RolePrimary text on dark · Pure backgrounds
50 #F2F2F2 Fail AAA
100 #F4F4F4 Fail AAA
200 #F6F6F6 Fail AAA
300 #F9F9F9 Fail AAA
400 #FCFCFC Fail AAA
●
500 #FFFFFF Fail AAA
600 #CBC9C9 Fail AAA
700 #999090 AA* AA
800 #665959 AA Fail
900 #2E2626 AAA Fail
950 #110E0E AAA Fail
03 — Typography
Inter Type Scale

Inter is the official Tenovos typeface. ExtraBold (800) for all headlines in sentence case. Medium (500) for body. Never use Light or Italic. Copy the CSS tokens below for your project.

Display
80px/1.0800-0.03em
Hero campaigns, full-bleed moments
AI-Native Content Intelligence Platform.
Heading 1
60px/1.05800-0.02em
Page-level headlines
Content Intelligence Platform
Heading 2
48px/1.1800-0.02em
Section headers
See what works. Scale what performs.
Heading 3
40px/1.15800-0.015em
Subsection headers, cards
Everything Connected.
Heading 4
28px/1.2800-0.01em
Card headlines, callouts
Turn insight into action
Body Large
20px/1.65000
Lead paragraphs
A content-first platform to help you find, use, and share what matters.
Body
16px/1.655000
Standard body copy
Tenovos helps global teams manage their content lifecycle from creation to distribution, with AI-driven insight at every step.
Caption
13px/1.55000.04em
Labels, captions, overlines
WELCOME TO TENOVOS GLASS
Micro
11px/1.45000.08em
Badges, tags, metadata
BRAND GUIDELINES 2026
CSSDesign tokens — paste into your :root {}
04 — Iconography
Radix UI Icons
Tenovos uses Radix UI icons — thin stroke, 15×15 viewBox, MIT licensed. Always stroke only, never filled. Install via npm or reference CDN paths directly.

  
Specifications

  
Library@radix-ui/react-icons

  
ViewBox0 0 15 15

  
Stroke width1.2–1.5px

  
Fillnone (stroke only)

  
Min render size15 × 15px

  
Standard UI size16 – 20px

  
Feature / hero24 – 32px

  
LicenseMIT



  
Color Usage

  
On dark bgWhite #FFFFFF

  
Accent / activeHighlight #7AA5FF

  
On light bgNavy #1F2643

  
Muted / disabled40% opacity

  
Never usefill · shadow · outline

  
Gap from label4 – 8px

  
Alignmentvertical-align:middle

  
React installnpm i @radix-ui/react-icons



  
    
  
  Eye


  
    
  
  Search


  
    
  
  Layers


  
    
  
  Share


  
    
  
  Star


  
    
  
  Lightning


  
    
  
  Globe


  
    
  
  Link


  
    
  
  Download


  
    
  
  Upload


  
    
  
  Archive


  
    
  
  Clock


  
    
  
  Person


  
    
  
  People


  
    
  
  Camera


  
    
  
  Video


  
    
  
  Image


  
    
  
  Chart


  
    
  
  Grid


  
    
  
  Rocket


  
    
  
  Gear


  
    
  
  Bell


  
    
  
  Lock


  
    
  
  Mail


  
    
  
  Bookmark


  
    
  
  Heart


  
    
  
  Code


  
    
  
  Database


  
    
  
  Magic


  
    
  
  Sparkle

05 — Voice & Tone
How We Sound
Tenovos speaks with clarity and confidence. We're the intelligent partner who helps you move faster. Short sentences. Concrete value. Never jargon.

  
01
Intelligent
We understand content operations deeply. We speak to complexity precisely without being academic. Data-backed, never data-drowning.

  
02
Direct
Lead with the value. Active voice. Write shorter sentences than you think you need. Every word earns its place on the page.

  
03
Human
Built by and for people. Warm without being casual. Confident without arrogance. We mean what we say and say what we mean.

  
04
Forward
We look ahead. Language of possibility, not limitation. "Unlock" not "manage." "Scale" not "maintain." Energy in every line.



  
Copy Examples

  

    

      
✓ Write This

      
Unlock the full value of your content.

      
See what works. Scale what performs.

      
Turn insight into action.

      
Smarter content starts here.

      
Built for teams who move fast.

    

    

      
✕ Not This

      
Leverage synergistic content solutions.

      
Comprehensive asset management suite.

      
Our platform enables content utilization.

      
Robust DAM functionality at scale.

      
End-to-end content lifecycle management.

    

  




07 — Data Visualization


Infographics & Diagrams


Brand-grade data visualization for presentations, reports, and digital content. Use brand blues, concentric geometry, and directional flow — always on dark navy.




  
  

    
      
      
      
      
      
      
      
      
      
      
      
      0
      25
      50
      75
      
      Q1
      Q2
      Q3
      Q4
      Q5
      
      
      
      
      
      
      
      
      
      
      
      
      
      
      CONTENT REACH GROWTH · QUARTERLY
      
        
          
          
        
      
    
    

      
Bubble Chart

      
XY scatter with proportional bubbles. Use for multi-variable comparisons in executive decks and annual reports.

    

  


  
  

    
      
      
      
      
      
      
      
      
      
      
      
      
      
      
      
      
      
      
      
      
      
      
      
      
      
      
      
      BRAND
      CONTENT
      SOCIAL
      EMAIL
      PAID
      WEB
      EVENTS
      DAM
      
      CHANNEL NETWORK · CENTRALIZED DISTRIBUTION
    
    

      
Node Network

      
Hub-and-spoke topology for platform ecosystem diagrams. DAM as central hub radiating to all channels.

    

  


  
  

    
      
      
      
      
      
      
      
      
      
      
      
      
      
      
      
      INFLECTION
      
      Mo 1
      Mo 3
      Mo 6
      Mo 9
      Mo 12
      
      0%
      50%
      75%
      
      ADOPTION CURVE · TIME TO FULL DEPLOYMENT
      
        
          
          
        
        
          
          
        
      
    
    

      
S-Curve Growth

      
Adoption and growth curves with inflection point callouts. Use in roadmaps, maturity models, and impact timelines.

    

  


  
  

    
      
      
      
      
      
      
      
      
      
      
      
      
      
      
      
      
      
      
      
      
      REACH
      QUALITY
      SPEED
      REUSE
      BRAND FIT
      SCALE
      
      CONTENT MATURITY RADAR · SIX DIMENSIONS
      
        
          
          
        
      
    
    

      
Radar Chart

      
Six-dimension content maturity model. Use for capability assessments, benchmarks, and before/after platform comparisons.

    

  


  
  

    
      
      
      
      
      
      
      
      
      
      
      
      
      
      
      
      
      
      VIDEO
      IMAGE
      DOCS
      
      SOCIAL
      EMAIL
      PAID
      
      TENOVOS DAM
      
      CONTENT FLOW · ASSET TYPE TO CHANNEL
      
        
        
        
      
    
    

      
Sankey / Flow

      
Curved flow diagram connecting asset types to distribution channels. Use for platform narrative and content lifecycle decks.

    

  


  
  

    
      
      
      
      
      
      
      
      
      
      
      
      
      
      
      
      
      
      
      
      
      
      
      
      Without DAM
      
      With Tenovos
      
      PRODUCTIVITY INDEX · WITH VS WITHOUT DAM
      
        
        
        
      
    
    

      
Line Comparison

      
Before/after line chart for ROI storytelling. Two-line format for clear contrast. Gradient line = Tenovos outcome.

    

  





09 — Spacing
8-Point Grid
All spacing derives from an 8px base unit. Use multiples for margins, padding, and gaps. Use 4px only for micro/inline adjustments.

  8px
  

  --tnv-space-8


  16px
  

  --tnv-space-16


  24px
  

  --tnv-space-24


  32px
  

  --tnv-space-32


  48px
  

  --tnv-space-48


  64px
  

  --tnv-space-64


  96px
  

  --tnv-space-96


  128px
  

  --tnv-space-128


  192px
  

  --tnv-space-192



06 — Visual Language


Illustration & Motion Style


Tenovos visual language is orbital, data-precise, and always purposeful. Motion never decorates — it communicates. Diagrams use concentric geometry, directional flow, and the full brand palette.




  

    
Brand in Motion

    
Orbital Motion System

    
The concentric ring animation is the core Tenovos motion signature — radiating intelligence, connected data, continuous forward momentum. Use in hero sections, product showcases, and brand storytelling moments.

    
    
      
  • Smooth continuous loop — never cut or freeze mid-frame
    • 
      
  • Gradient from #006DE7 → #7AA5FF
    • 
      
  • Always on dark navy. Never over body text
    • 
      
  • Pair with concise, confident copy — let motion do the work
    • 
    

  

  

    

      
      

    

  






  

    

  
  
  
  
  
  
  
  
  
  
  
  
  
  
  
  
  
  
  
  
  
  
  VIDEO
  IMAGE
  DOCS
  TEMPLATES
  
  AI LAYER
  
    
      
      
    
  


    

      
Content Intelligence Map

      
Orbital nodes diagram — AI at centre, content types in orbit. Use for product explainers and platform overviews.

    

  

  

    

  
  
  
  
  
  
  
  
  
  
  
  
  
  
  
  
  INGEST
  ENRICH
  AI CORE
  ACTIVATE
  MEASURE
  
  Content Sources
  Intelligence Layer
  Outcomes
  
  AI CONTENT PIPELINE · FIVE-STAGE FLOW
  
    
      
      
      
    
    
      
    
  


    

      
AI Pipeline Flow

      
Ingest → Enrich → AI Core → Activate → Measure. The five-stage intelligence flow for sales and marketing materials.

    

  

  

    

  
  
  
  
  
  
  
  
    
    
    
    
  
  
  GEOMETRIC PROPORTIONS · TENOVOS MARK
  
  
  #1677FF
  
  #2E56A9
  
  #7AA5FF
  
  #FFFFFF


    

      
Mark Geometry

      
Proportional breakdown of the Tenovos icon mark — three shapes, three blues, one forward-moving system.

    

  







08 — Brand in Action


See It Move


Tenovos in motion — platform storytelling, product showcases, and brand narrative. Reference these for tone, pacing, and visual language.



  

    

      
    

    

      
Brand Reel

      
Platform storytelling · Hero & launch moments

    

  

  

    

      
      
    

    

      
Content Chaos

      
Problem framing · Sales & demand generation

    

  





  

    
Usage

    
Hero sections, product launches, sales enablement, brand storytelling moments

  

  

    
Tone

    
Confident, forward-moving. Let the visuals carry. Copy stays short and declarative

  






10 — Visual Direction


Brand in the Wild


Real-world applications of the Tenovos brand system — social content, carousels, slide decks, and platform presence. Use these as creative reference for new campaigns.





  

    Presentation
    Slide deck example — for reference only
  

  

    
    This presentation is shown for brand reference. To build a deck, contact brand@tenovos.com
  

  

    
  









  

    LinkedIn
    Company page — header & first post
  

  

    

      

      
linkedin.com/company/tenovos

    

    

      Tenovos LinkedIn company page
      

    

    

    

  






  Social Carousel
  Content Intelligence & DAM — LinkedIn post assets




  

    Content Intelligence Carousel — Cover
    
Content Intelligence · Cover slide

  

  

    Content Intelligence — Visibility slide
    
Content Intelligence · Visibility

  

  

    DAM Built to Power — Cover
    
DAM Content Supply Chain · Cover

  

  

    DAM Built to Power — Platform visual
    
DAM Content Supply Chain · Platform