Brand Guidelines

Resources for presenting the Vallit brand consistently and professionally.

Naming

“Vallit” is a single word, always spelled with a capital “V”. It is the brand name of both our company and our application.

When referring to our AI engine, use “Kian” with a capital “K”.

When referring to dedicated releases or products from Vallit, we ask that you capitalize them as proper nouns (e.g., “Vallit Platform”, “Kian AI”).

Logo

The Vallit logo should be used in all references to Vallit as space allows. Monochrome usage is preferred with the brand colors below.

Dark Background

Light Background

Vallit

Wordmark with logo

Colors

Comfortable against light and dark backgrounds, Vallit's primary brand color is a subtle monochrome palette. The following colors are used throughout our design system.

Background Body

Dark mode

#000000

--bg-body

Light mode

#fafafa

--bg-body

Background Surface

Dark mode

#0a0a0a

--bg-surface-1

Light mode

#ffffff

--bg-elevated

Text Primary

Dark mode

#ededed

--text-primary

Light mode

#171717

--text-primary

Text Secondary

Dark mode

#a1a1a1

--text-secondary

Light mode

#52525b

--text-secondary

Text Tertiary

Dark mode

#666666

--text-tertiary

Light mode

#71717a

--text-tertiary

Border

Dark mode

rgba(255, 255, 255, 0.06)

--border

Light mode

rgba(0, 0, 0, 0.08)

--border-subtle

Accent

Dark mode

#ffffff

--accent

Light mode

#171717

--accent

Typography

Vallit uses Inter as its primary typeface. Inter is a variable font designed for computer screens, optimized for readability at all sizes.

Heading 1

Bold, 36-48px, -0.02em letter-spacing

Used for hero headlines and primary page titles.

Heading 2

Semibold, 24-32px, -0.02em letter-spacing

Used for section titles and secondary headings.

Body Text

Regular, 16px, 1.6 line-height

Used for body copy, descriptions, and general content. Inter provides excellent readability across all screen sizes and weights.

Source: Inter is available from Google Fonts. The font is loaded via Next.js font optimization for optimal performance.

Usage

Provide plenty of space around Vallit assets. Make them big or make them small, but give them room to breathe. They shouldn't feel cramped or cluttered.

Do

  • • Use the logo with adequate spacing
  • • Maintain the logo's aspect ratio
  • • Use monochrome versions on colored backgrounds
  • • Reference Vallit as a proper noun

Don't

  • • Alter or distort the logo
  • • Use the logo to imply endorsement
  • • Combine the logo with other graphics
  • • Use the logo as part of your product name

Note: The provided graphics are proprietary and protected under intellectual property laws. Do not alter these files in any way, display these graphics in a way that implies a relationship, affiliation, or endorsement by Vallit of your product, service, or business. Do not use these graphics as part of your own product, business, or service's name, or combine these graphics with any other graphics without written consent from Vallit.