Colors

These are the colors used in the design. You can easily adjust them by using the Global Swatch feature.

Color Dark

#1E1D1E

Text

Text Color Dark

#323232

Color Dark Transparent

#1E1D1E / A15

Color Light

#F2F2F2

Text

Text Color Light

#F2F2F2

Color Light Transparent

#F2F2F2 / A15

None

#FFFFFF / A0

Transparent Box

#FFFFFF / A90

Color Light Transparent 50%

#FFFFFF / A50

Color Accent 01

#BC82DC
‍

Color Accent 02

#F3A7D8

Typography

HTML Heading tags

If you edit the styles here, they will change across the website. We have a global system for headings, typography sizing, coloring, and customizations.

H1 - Aa Bb Cc

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. Nunc ut sem vitae risus tristique posuere.

Satoshi Bold 41px / 130%

H2 - Aa Bb Cc

Satoshi Bold 34px / 130%

H3 - Aa Bb Cc

Satoshi Bold 28px / 130%

H4 - Aa Bb Cc

DM Sans Bold 23px / 130%

H5 - Aa Bb Cc

DM Sans Bold 19px / 140%

H6 - Aa Bb Cc

DM Sans Bold 16px / 140%

Heading Classes

Use class prefix heading - on H1, H2, H3, or any other piece of text to change it to a specific heading size.

Display 1- Aa Bb Cc

Satoshi Bold 50px / 120%

Heading Xlarge - Aa Bb Cc

Satoshi Bold 41px / 130%
Looks like H1

Heading Large - Aa Bb Cc

Satoshi Bold 34px / 130%
Looks like H2

Heading Big - Aa Bb Cc

Satoshi Bold 28px / 130%
Looks like H3

Heading Medium - Aa Bb Cc

DM Sans Bold 23px / 130%
Looks like H4

Heading Small - Aa Bb Cc

DM Sans Bold 19px / 140%
Looks like H5

Heading Tiny - Aa Bb Cc

DM Sans Bold 16px / 140%
Looks like H6

Paragraphs

Paragraphs and other common text elements. If you edit the styles here, they will change across the website.

Paragraph Normal - DM Sans Normal 16px / 160%

Paragraph Small - DM Sans Normal 14px / 160%

Text Size Tiny - DM Sans Medium 12px / 160%

Text Size Tiny Caps - DM Sans Bold 11px / 140%

Rich Text

If you edit the block quote style here, it will change across the website.

What’s a Rich Text element?

The rich text element allows you to create and format:

headings,
paragraphs,
blockquotes,
images
video

... All in one place instead of adding and formatting them individually. Just double-click and easily create content.

‍

Static and dynamic content editing

Pelentesque habitant morbi tristique senectus:

Item 1
Item 2
Item 3

How to customize formatting for each rich text

Headings, paragraphs, blockquotes, figures, images, and figure captions can all be styled after a class is added to the rich text element using the "When inside of" nested selector system.

‍

How to customize formatting for each rich text

Headings, paragraphs, blockquotes, figures, images, and figure captions can all be styled after a class is added to the rich text element using the "When inside of" nested selector system.

Anna Shimafuji

CEO, Neuralport.Inc | Forbes JAPAN Women In Tech TOP30

I work with Sonya at my startup, where her XR design expertise and broad skill set—including pitch creation, networking, diplomacy, and data analysis—are invaluable. She’s a hardworking, talented, and highly motivated person. I'm very happy to work with her.

Vineet Nalawade

Sr. Engineer XR at Qualcomm

I worked with Sonya on a VR app project, where her punctuality, creativity, and attention to detail kept us on track. Her stunning, user-friendly UI designs made a huge impact, and collaborating with her was a smooth, enjoyable experience. I'd gladly work with her again.

Jorge Luis Copete Vasco

Technical Engineer Researcher, Osaka University

I've worked with Sonya over the past years, and she's proven to be an exceptional designer with strong communication skills. Sonya played a vital role in designing the audiovisual interface for our XR application, quickly aligning with the product concept and delivering impactful results. I give my best recommendation.

Katrina Affleck

CEO at XR Wellness | XR for hospital patients

I had the pleasure of working with Sonya on two VR projects. She is highly creative and brings a lot to a project, she works efficiently and is dedicated to what she does, testing the final versions until she's sure their perfect. She has a lot of creative ideas - a grand professional! Thanks Sonya I hope to work with you again in future projects.

Mary Wilson

CEO, Exuberante Caos Associação | Immersive Mural

We had the pleasure of working with Sonya on our AR Scavenger Hunt project, we couldn’t be happier with the results. She is a talented XR Designer with expertise in UI/UX Design and Web AR Onirix to implement gamification & geolocation, with clear communication. We highly recommend Sonya for any AR/VR project!

Welcome

New Ideas

Welcome

New Ideas

Welcome

New Ideas

Welcome

New Ideas

Welcome

New Ideas

Welcome

New Ideas

Welcome

New Ideas

Welcome

New Ideas

Home

About

Projects

Blog

Contact

This style guide presents the colors, fonts, and interactive elements used in the Centim template.

Colors

Typography

H1 - Aa Bb Cc

H2 - Aa Bb Cc

H3 - Aa Bb Cc

H4 - Aa Bb Cc

H5 - Aa Bb Cc

H6 - Aa Bb Cc

Display 1- Aa Bb Cc

Heading Xlarge - Aa Bb Cc

Heading Large - Aa Bb Cc

Heading Big - Aa Bb Cc

Heading Medium - Aa Bb Cc

Heading Small - Aa Bb Cc

Heading Tiny - Aa Bb Cc

Rich Text

What’s a Rich Text element?

Static and dynamic content editing

How to customize formatting for each rich text

How to customize formatting for each rich text