aboutstudioworktestimonialshistoryteamservices

architecture that supports your brand success.

x
f
l
b
ratko.®
Contact.
Logo

Style Guide

Explore the core elements that define our visual and design identity. This guide outlines our principles, standards, and aesthetics to ensure a cohesive and impactful presence.

Colors

Choosing clean colors typically refers to selecting vibrant, pure hues that evoke a sense of freshness and clarity.
These colors often feature minimal muddiness or saturation, allowing them to appear crisp and appealing.

Primary
#333333
Secondary
#242424
Auxiliary color 1
#666666
Auxiliary color 2
#adadad
Auxiliary color 3
#cecece
Auxiliary color 4
#585858
Light background
#585858
White
#ffffff

Typography

Inter Tight is a specialized version of Inter with tighter spacing, for display usage. Inter is a variable font family carefully crafted & designed for computer screens.

H1 Heading 1

Inter Tight

Size: Desktop - 2.375 rem
H2 Heading 2

Inter Tight

Size: Desktop - 1.5 rem
H3 Heading 3

Inter Tight

Size: Desktop - 1.25 rem
H4 Heading 4

Inter Tight

Size: Desktop - 1.20 rem
H5 Heading 5
Inter Tight
Size: Desktop - 1.00 rem
H6 Heading 6
Inter Tight
Size: Desktop - 1.00 rem

Text - Normal

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse varius enim in eros elementum tristique. Duis cursus, mi quis viverra ornare, eros dolor interdum nulla, ut commodo diam libero vitae erat. Aenean faucibus nibh et justo cursus id rutrum lorem imperdiet. Nunc ut sem vitae risus tristique posuere.

Size: Desktop - 1.00 rem

Text - Small

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse varius enim in eros elementum tristique. Duis cursus, mi quis viverra ornare, eros dolor interdum nulla, ut commodo diam libero vitae erat. Aenean faucibus nibh et justo cursus id rutrum lorem imperdiet. Nunc ut sem vitae risus tristique posuere.

Size: Desktop - 0.875 rem

Rich text

Here you can see and change the form component

Heading 1

Heading 2

Heading 3

Heading 4

Heading 5
Heading 6

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur.

Block quote

Ordered list

  1. Item 1
  2. Item 2
  3. Item 3

Unordered list

  • Item A
  • Item B
  • Item C

Text link

Bold text

Emphasis

Superscript

ratko.
Studio

if you have any suggestion or desire for cooperation, feel free to contact us via our contact details or contact form

Contact

Address

Working Hours

Menu

HomeLatest ProjectsWorkTestimonialsContact
Contact section image

share you idea
with our team

Thank you! Your submission has been received!
Oops! Something went wrong while submitting the form.

if you have any suggestion or desire for cooperation, feel free to contact us via our contact details or contact form

ratko.©