Aa
#05030FVoid
Main background. A dark stage for the character and light.
--voidANIVATAR / WEBSITE VISUAL SYSTEM
Brandbook.
Intelligence takes on character.
Colour, typography, light and the rules that bring them together in one language.
01 / ANIVATAR
Intelligence. With character.
Anivatar gives technology a face, a voice and the ability to act. People remain at the centre of the experience.
CORE PRINCIPLE
Controlled
contrast.
Human and machine. Darkness and spectral light. Monumental typography and calm, readable descriptions. Each screen has one dominant visual moment.
Alive
Present and responsive.
Bold
Bold in scale and language.
Intelligent
Precise and purpose-driven.
Human
Close to people.
Unexpected
Surprising through a change of rhythm.
02 / ANIVATAR
Color has its role.
The website’s core palette. Each swatch shows a colour, its HEX value and its use. Saturated accents draw the eye to what matters.
Aa
#0B0824Deep Space
Panels, galleries and secondary surfaces.
--deep-spaceAa
#F7F5FFGhost
Main text on a dark background.
--ghostAa
#C9C5D6Mist
Descriptions, captions and secondary text.
--mistAa
#7226FFElectric Violet
Brand identity, energy and lighting accents.
--violetAa
#F042FFHyper Magenta
Expression, voice and visual highlights.
--magentaAa
#87F5F5Plasma Cyan
Primary actions, active states and keyboard focus.
--cyanAa
#C8FF2EAcid Lime
A prominent contact button and an accent for calls to action.
Website accents and surfaces
Electric Blue
#225CFFGradients for headings and lighting for scenes.
Laser Blue
#00CFFFThe VATAR accent in the logo and luminous details.
Ultraviolet
#3A00FFAn additional spectral accent.
Signal Blue
#245BFFTechnological modules and data flow.
Light stage
#FBFDFFA contrasting surface for the manifesto.
Error
#FF4F68A semantic error colour, always paired with a message.
Supplementary colours from the brand guidelines: Night Indigo #160078, Soft Photon #F4F3F8, Ink #0B0913 and Solar Orange #FF5A36. These colours can be used in future scenes and materials; the core colours of the current website are shown above.
65%Background
25%Imagery and neutral surfaces
10%Accent
03 / ANIVATAR
Three typefaces. One voice.
The website uses Space Grotesk, Manrope and Oxanium. Each has a fixed role, while its size adapts to the screen width.
01 / DISPLAY
Space Grotesk
Headings, large numbers and the logo. Short statements, bold scale and tight rhythm. Predominant weight: 600.
AI that
looks you in the eye.
Aa Bb 0123456789
Ą Ć Ę Ł Ń Ó Ś Ź Ż · ą ć ę ł ń ó ś ź ż
02 / BODY & UI
Manrope
Paragraphs, forms and buttons. Body text: weights 400–500. Highlights and actions: 600–700. Comfortable line spacing and clear reading.
Technology begins with conversation.
We create digital characters that listen, respond and help people act. The quick brown fox jumps over the lazy dog.
Aa Bb 0123456789 · A B C D E F G
03 / TECH ACCENT
Oxanium
Indexes, micro labels, statuses and main navigation. Uppercase letters, expanded letter spacing and weights of 500–600.
VOICE / HUMAN / AI
System 01–08
Aa Bb 0123456789
Ą Ć Ę Ł Ń Ó Ś Ź Ż · ą ć ę ł ń ó ś ź ż
The type scale is fluid. Large headlines fill the scene; paragraphs retain a comfortable width and line height of around 1.6. On phones, headings have more line spacing so Polish diacritics remain fully visible. A gradient highlights just one short part of a headline.
04 / ANIVATAR
The brand signature.
The original Anivatar logo combines a human profile with a flowing, spectral symbol. We use the light or dark version to suit the background.
Keep
Keep the logo on one line, preserve its original proportions, place it on a legible background and leave clear space around it. Use the same spelling in the header and footer.
Avoid
Do not stretch the logo, change its typeface, apply arbitrary colours or effects, or place the symbol over a character’s face or a busy image.
05 / ANIVATAR
Light reveals personality.
The gradient acts like a light source: on the character, in a halo or across a short part of a heading. Longer text stays a solid colour.
Signature Spectrum
The primary brand gradient.
115° · #7226FF → #F042FF (44%) → #87F5F5Website heading spectrum
A variation used in subpage headings.
90° · #225CFF → #F042FF → #87F5F5
Close to people.
A deliberate gaze, close framing and room for typography. Two colour temperatures bring out the face, while a rim light separates it from the background.
Photorealism and stylisation can coexist. Framing, lighting and presentation create consistency.
Motifs include light around the character, the voice field and the scan line. Geometric icons support clear labels.
06 / ANIVATAR
Space is important.
A flexible 12-column grid, technical lines and a changing rhythm: a large scene, calm description, then another strong accent.
010203040506070809101112
Margins and rhythm
On wide screens, the side margin is usually 4% of the width, bounded between 24 and 72 px. On phones it is usually 20 px. Content and buttons always stay within the safe area.
Form and Hierarchy
A single action uses a pill-shaped button. Choosing among options uses a rectangle with square corners. The same rule applies to use cases, the gallery, the brief and the chat. Content modules remain flat; on phones, columns become a readable sequence.
07 / ANIVATAR
Actions are clear.
Every action has a clear label. Colour, outline and motion reinforce its meaning, while keyboard focus identifies the active element.
SINGLE ACTIONS / ROUNDED
Meet the characters
Primary action / Plasma Cyan + Void
Start a project
Contact / Acid Lime + Void
Explore the colours
Secondary action / subtle outline
OPTION SELECTION / RECTANGULAR
Contrast and accessibility
Ghost and Mist on Void. Dark text on Cyan, Magenta and Lime. Light text on Electric Violet. We always describe a state with a word or icon, even when its colour changes.
Purposeful motion
Button response: 180 ms. Recommended timing for text entrances: 450–800 ms; scene changes: 700–1400 ms. Motion confirms an action or state change. A reduced-motion preference disables unnecessary animations.
08 / ANIVATAR
We speak plainly.
Short, bold sentences. Verbs instead of jargon. We explain technology through what it enables people to do.
One personality.
Every channel.
The Anivatar voice
“A story that responds.”
“A home that understands more than commands.”
“Technical knowledge exactly where it is needed.”
The principle of communication
We connect vision to practical use. We explain whom we help and how. We avoid empty superlatives, unsupported statistics and promises to replace people.