elements

Typography

  • You are here:
  • Home
  • Typography

h1 Heading

This is example of standard h2 heading. The best practice for SEO purposes is to have one h1 heading on your page. For example you can use it on your page title, like we did in this template.

h2 Heading

This is example of standard h2 heading. It is used for all major headings on your page. For example the page name is Services. This will be h1 heading. After that you have specific service called "Consulting". This will be h2 heading.

h3 Heading

This is example of h3 heading. According to our previous heading standard, on services page you have main service called "Consulting". Then of course you have different fields of consulting, like "Tourism Consulting". That will be heading h3.

h4 Heading

This is example of standard h4 heading. It is used for less important headlines. The basic rule is to follow hierarchy. So for example you have service "Tourism Consulting", like we mentioned previously. If you have different services for that main service and you are showing them on that same page, the heading of that services should be h4.

h5 Heading

This is example of standard h5 heading. It is used for some small elements on the page, less important elements. Where you will use it will depend on structure of your page and how many main sections and subsections you have.

h6 Heading

This is example of standard h6 heading. It is used for some small elements on the page, less important elements. Where you will use it will depend on structure of your page and how many main sections and subsections you have.

custom headings

Custom heading style 01

This is example of custom heading style 01. It has small title on the top and main title on the bottom. Perfect for showcasing small amount of content. It is left aligned and fits perfectly on any page.

Center aligned custom heading

custom headings

This is example of custom heading style 02. It is center aligned, title is in focus on first place, and you also have subtitle where you can describe what that section is about. It can be only two words, or maybe two sentences.

Custom heading style 03

This is example of custom heading style 03. It is simple heading perfect for use on inner pages of your site. You can change border color in color.css file in quick and easy way to match it to your brand needs.

Blockquote

This is example of a blockquote. You can use it for your company mission and vision statement or on a page showcasing some authors quote.

"I always love when you upload something new. Your attention to detail, uniqueness and story driven design is a joy to explore. Every pixel is there for a reason, nothing is generic, and it all works great together. Truly an inspiration to look p to, and steal from."

- ColorByt

Text element

This is simple p tag. Here we will show you different styling for text element you can use. For example this is bold text. There is sometimes a need to color the text. We did it in theme colors. This is how it looks. You may have a need to color the background of the text, that is to highlight something important. This is highlighted text.

Code element

This is one of the standard HTML elements. 

jQuery(document).ready(function ($) {
    'use strict';
    // Your code goes here
});