Font Styles and Sizes

The following font styles and size are used on the Epitom website.

Font Styles

ROBOTO - THIN FONT STYLE:
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut elit tellus, luctus nec ullamcorper mattis, pulvinar dapibus leo.Lorem ipsum dolor sit amet consectetur adipiscing elit dolor

ROBOTO - NORMAL FONT STYLE:
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut elit tellus, luctus nec ullamcorper mattis, pulvinar dapibus leo.Lorem ipsum dolor sit amet consectetur adipiscing elit dolor

ROBOTO - BOLD FONT STYLE:
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut elit tellus, luctus nec ullamcorper mattis, pulvinar dapibus leo.Lorem ipsum dolor sit amet consectetur adipiscing elit dolor

ROBOTO - BLACK FONT STYLE:
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut elit tellus, luctus nec ullamcorper mattis, pulvinar dapibus leo.Lorem ipsum dolor sit amet consectetur adipiscing elit dolor

Thin

Normal

Bold

Black

Font Sizes

Example of Heading 1 Size

Example of Heading 2 Size

Example of Heading 3 Size

Example of Heading 4 Size

Example of Heading 5 Size

Example of Heading 6 Size

This is an example of the Body text 17px to 16px

This is an example of the SMALL text size.

This is an example of the VERY SMALL text size.

Dark Background Number 1

To create a corporate color set that complements your main brand color, #97D8C4, while addressing the issue of small print on a white background, I’ll suggest a few color categories:

1. Primary Color (Main Brand Color)

  • #97D8C4: This is your main brand color, which is a soft, cool mint-green shade. While it’s great for backgrounds or large design elements, it’s not ideal for small text on a white background.

2. Darker Complement (for Text)

  • #2C7A71: A darker, deeper green that is easy to read on white backgrounds. Use this for headings, text, and other elements that require readability.

3. Secondary Accent Colors

These will be used to complement your brand color in various areas like buttons, icons, or highlights:

  • #FF6F61: A warm coral, offering contrast and vibrancy against the mint-green.
  • #4A90E2: A soft but more saturated blue, which provides a cool balance.

4. Neutral Supporting Colors

These will serve as background colors or for less dominant design elements:

  • #F0F4F4: A very light gray that can be used as a background color instead of white for a softer look.
  • #303030: A dark charcoal gray for headers or footers.

5. Highlight Color

  • #FFD700: A rich gold or yellow that can act as a highlight or call-to-action button color, providing warmth and contrast to the cooler green.

This is an example of the SMALL text size.

This is an example of the VERY SMALL text size.

Add Your Heading Text Here

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut elit tellus, luctus nec ullamcorper mattis, pulvinar dapibus leo.

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut elit tellus, luctus nec ullamcorper mattis, pulvinar dapibus leo.

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut elit tellus, luctus nec ullamcorper mattis, pulvinar dapibus leo.

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut elit tellus, luctus nec ullamcorper mattis, pulvinar dapibus leo.

Add Your Heading Text Here

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut elit tellus, luctus nec ullamcorper mattis, pulvinar dapibus leo.

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut elit tellus, luctus nec ullamcorper mattis, pulvinar dapibus leo.

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut elit tellus, luctus nec ullamcorper mattis, pulvinar dapibus leo.

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut elit tellus, luctus nec ullamcorper mattis, pulvinar dapibus leo.

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut elit tellus, luctus nec ullamcorper mattis, pulvinar dapibus leo.

Add Your Heading Text Here

To create a corporate color set that complements your main brand color, #97D8C4, while addressing the issue of small print on a white background, I’ll suggest a few color categories:

1. Primary Color (Main Brand Color)

  • #97D8C4: This is your main brand color, which is a soft, cool mint-green shade. While it’s great for backgrounds or large design elements, it’s not ideal for small text on a white background.

2. Darker Complement (for Text)

  • #2C7A71: A darker, deeper green that is easy to read on white backgrounds. Use this for headings, text, and other elements that require readability.

3. Secondary Accent Colors

These will be used to complement your brand color in various areas like buttons, icons, or highlights:

  • #FF6F61: A warm coral, offering contrast and vibrancy against the mint-green.
  • #4A90E2: A soft but more saturated blue, which provides a cool balance.

4. Neutral Supporting Colors

These will serve as background colors or for less dominant design elements:

  • #F0F4F4: A very light gray that can be used as a background color instead of white for a softer look.
  • #303030: A dark charcoal gray for headers or footers.

5. Highlight Color

  • #FFD700: A rich gold or yellow that can act as a highlight or call-to-action button color, providing warmth and contrast to the cooler green.

Add Your Heading Text Here

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut elit tellus, luctus nec ullamcorper mattis, pulvinar dapibus leo.

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut elit tellus, luctus nec ullamcorper mattis, pulvinar dapibus leo.

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut elit tellus, luctus nec ullamcorper mattis, pulvinar dapibus leo.

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut elit tellus, luctus nec ullamcorper mattis, pulvinar dapibus leo.

Add Your Heading Text Here

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut elit tellus, luctus nec ullamcorper mattis, pulvinar dapibus leo.

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut elit tellus, luctus nec ullamcorper mattis, pulvinar dapibus leo.

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut elit tellus, luctus nec ullamcorper mattis, pulvinar dapibus leo.

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut elit tellus, luctus nec ullamcorper mattis, pulvinar dapibus leo.