Brand
Logo, naming, typography, and color rules for the ViraStack brand. The same language is used across product pages and in copy.
Logo
Use the mark alone or with the wordmark. The wordmark is always written as ViraStack; never apply CSS uppercase.
Naming
Don’t use the product name alone, for example Mask. Always write the full lockup: ViraStack Mask. Short names alone are fine only in dense navigation.
- ViraStack Startteal-500
- ViraStack AIfuchsia-500
- ViraStack Maskindigo-500
- ViraStack Passwordrose-500
- ViraStack Guideamber-400
Typography
Black for headings, semibold everywhere else. The product name stays medium italic in its color.
Heading
ViraStack Start
font-black · text-4xl / lg:text-6xl · font-medium italic · text-teal-500
Logo
ViraStack Start
font-semibold · text-lg · font-medium italic · text-teal-500
Body
ViraStack Start
font-semibold · inherit (text-base) · font-medium italic · text-teal-500
Colors
Each product maps to a Tailwind color. Only the active brand shade is shown.
ViraStack
primary · #161616 / #e5e5e5
ViraStack Start
teal-500 · #00baa6
ViraStack AI
fuchsia-500 · #e131fa
ViraStack Mask
indigo-500 · #605efe
ViraStack Password
rose-500 · #ff2056
ViraStack Guide
amber-400 · #ffb900