v1.1 v1.1 Official brand guidelines for logos, colors, typography, and components across all Kanvao products. Message. Done.
The foundation of how Kanvao looks, speaks, and connects with its audience.
Unlock growth for small businesses with an AI assistant that "handles it" on WhatsApp and beyond.
Correct usage, clear space requirements, approved variants, and what to avoid.
Full-color · Light backgrounds
White · Dark backgrounds
Icon mark · Min 32px
1× inner eye height of O‑bot120px digital · 30mm printElectric Edge palette — 5 brand colors with pre-checked WCAG AAA accessibility pairs. Hover each strip.
#00C2A8 #0A1A2F #C7FF00 #F7F9FA #2D2D2D Fails WCAG AA (min 4.5:1) — never use for text.
Virtually no contrast — only use lime on navy backgrounds.
Two typefaces, one clear purpose. Outfit for impact, Inter for clarity.
<link href="https://fonts.googleapis.com/css2?
family=Outfit:wght@500;600;700
&family=Inter:wght@400;500;600
&display=swap" rel="stylesheet">
font-family:"Outfit","Poppins",system-ui,sans-serif;
font-family:"Inter","SF Pro Text",system-ui,sans-serif;Core interactive elements with consistent style, spacing, and accessible states.
Hover: darken 6–8% · Focus: 4px teal ring at 20% opacity
Please enter a valid email address.
Focus: teal ring · Error: red border + aria-describedby
Chips: rounded-full · Banners: rounded-xl
Official brand assets. Use as-is — do not alter colors, proportions, or clear space.
/brand
/assets
kanvao-logo.png — Full-color, light bg
kanvao-logo-white.png — White variant, dark bg
kanvao-logo-black.png — Mono, print only
kanvao-icon.png — Icon / favicon
kanvao-avatar.png — Transparent PNG, 1024×1024
kanvao-logo-profile.png — Profile square, 400×400
design-tokens.json — Colors, type, spacing tokens
index.html — This document
All Kanvao products use Tailwind CSS v3 with this shared config. Copy it into your tailwind.config.mjs to stay on-brand out of the box.
// tailwind.config.mjs
export default {
content: ['./src/**/*.{astro,html,js,ts,tsx,vue,svelte}'],
theme: {
extend: {
colors: {
kv: {
teal: '#00C2A8', // Electric Teal — Primary
navy: '#0A1A2F', // Deep Navy — Surfaces
lime: '#C7FF00', // Neon Lime — Accent / CTA
bg: '#F7F9FA', // Off-White — Background
ink: '#2D2D2D', // Charcoal Ink — Body text
},
},
fontFamily: {
heading: ['Outfit', 'Poppins', 'system-ui', 'sans-serif'],
body: ['Inter', 'SF Pro Text', 'system-ui', 'sans-serif'],
},
borderRadius: {
card: '1.5rem',
},
},
},
plugins: [],
};When and how you're allowed to use Kanvao brand assets.
Partnerships, press, and co-branding approvals. Response within 2 business days.