NewCall Care AI answers every call, 24/7.Try it
+420 604 644 825info@evenir.czPrague 3, Žižkov
CZEN
Contact
HomeDesign system

Style guide · version 1.0

Design system
Evenir.

One visual language for the site, AI products and decks. Every token here matches a Figma variable, every component has its states.

8colour tokens from the original palette
2typefaces kept from the current brand

01

Colour

The brand palette stays. We only added darker and lighter teal steps so dark sections and surfaces have depth.

AA
Teal 500#19929B · --tealPrimary brand colour, links, active states
AA
Grey 600#5B5B5B · --greyBody text, secondary elements
Surface
Mist 200#D5E9EB · --mistSurfaces, tags, soft backgrounds
Surface
Orange 400#FF8243 · --orangeMain CTA only. Text on orange is always Ink 900.
AA
Teal 950#07363A · --teal-950Dark sections, flagship card
AA
Ink 900#1D2A2C · --inkHeadings and text on orange (6 : 1 contrast, AA)
Surface
Mist 50#EEF6F7 · --mist-50Section backgrounds, icon tiles
Surface
Line 200#DCE8EA · --lineCard and field borders
25
50
200
300
500
600
700
900
950

02

Typography

Large condensed headings give the site confidence, Montserrat keeps body text readable.

AÁBig Shoulders DisplayHeadings, numbers, labels. Kept from today’s site, used with more confidence.
AáMontserratBody, forms and buttons. Also carried over from the current brand.
01JetBrains MonoAI interfaces only: call timers, states, data.
Display XLBig Shoulders 800 · 92/83 · uppercase
AI for business
Display LBig Shoulders 800 · 64/60
Four AI products
Heading MBig Shoulders 800 · 40/40
Study results
Heading SBig Shoulders 800 · 27/27
Call Care AI
LeadMontserrat 400 · 18/30
We design, deploy and run AI agents.
BodyMontserrat 400 · 16/26
A person from our Prague team replies within a day.
LabelMontserrat 700 · 12 · +16 %
Our AI portfolio

03

Buttons and chips

One button, three variants, four states. Orange belongs only to the main action on screen.

DefaultHoverPressedDisabledPrimaryContinueContinueContinueContinueSecondaryContinueContinueContinueContinueTealContinueContinueContinueContinueSmallContactContactContactContact
Text linkChipSelected 6NewReal estateReal Estate AICall Care AI

04

Forms

50 px fields, 12 px radius, teal focus ring. Errors always carry text, not just colour.

Jan Novák
jan.novak@firma.cz
jan.novak@
Enter a valid e-mail
+420 777 123 456
Call Care AI
Checked Unchecked Selected Option On Off

05

Icons

A custom line set for AI and IT services, consistent across the site and products.

spark
headset
trend
home
shield
lock
cloud
server
layers
windows
users
calendar
phone-call
mail
pin
search
database
compass
puzzle
key
radar
gauge
file
arrow

24 px grid, 1.75 px stroke, round caps. In Figma as swappable component instances.

06

Spacing, radius, shadow

A 4 px base step. Sections are 120 px apart on desktop, 80 px on mobile.

space-44 px
space-88 px
space-1212 px
space-1616 px
space-2424 px
space-3232 px
space-4848 px
space-6464 px
space-9696 px
radius-sm8 px
radius-md12 px
radius-lg20 px
radius-xl28 px
radius-pill999 px
shadow-1Cards at rest
shadow-2Hover, form
shadow-3Floating panels

07

Breakpoints

Designed for 1440, 1200, 1024 and 390 px. Components adapt, they do not change.

Desktop 144012 columns, 1240 px content, 100 px margin
Laptop 120012 columns, 520 px hero visual
Tablet 1024Drawer menu, stacked sections
Mobile 3904 columns, 20 px margin, full-width CTA

Ready to put AI to work?

Show us one process that slows you down. In a free first call we will tell you whether and how AI can take it over.

Book a consultation