design sistem

LOGO

Colors

bg-main / #FFFFFF
bg-accent/ #620002
bg-secondary/ #fdf6ec
bg-secondary/ #1e1e1e

Typography

Heading H1

Heading H2

Heading H3

Heading H4

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.

accent font

Text Sizes | Weight | color

.text-size-large - Font Size: 1.25rem (20px), Line Height: 120%

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.

.text-size-regular- Font Size: 1rem (16px), Line Height: 120%

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.

.text-size-small - Font Size: 0.875rem (1px), Line Height: 120%

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.

.text-color-accent -> Text Color: accent

.text-color-secondary -> Text Color: secondary

All Unordered Lists

  • All Unordered Lists
  • All Unordered Lists
  • All Unordered Lists

.text-weight-bold - Font Weight: 700

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse varius enim in eros elementum tristique.

.text-weight-medium- Font Weight: 500

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse varius enim in eros elementum tristique.

.text-weight-regular - Font Weight: 400

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse varius enim in eros elementum tristique.

UI elements

Buttons

Main button
Button Text
Second button
Button Text
Second button accent bg
Button Text
Main button small
Button Text
Second button small
Button Text
Second button accent bg
Button Text

form element

Do you
have any questions?

Please provide your contact information. I'll call you or message you via your preferred messaging app to answer any questions you may have about the procedure, aftercare, and scheduling.

Thank you!
We'll be in touch with you soon!
Oops! Something went wrong while submitting the form.

icons

Radius

.rl_radius-large
.rl_radius-medium
.rl_radius-smalll

box Shadow

Add to cards, product cards, and service category cards

.smallcard-shadow
.medium-shadow
.large-shadow