SolarKal Style Guide

Headings and Text

All fonts are Plus Jakarta Sans unless otherwise specified.

Homepage H1

font size: 80px
font weight: 700 (bold)
line height: 100px

Subpage H1

font size: 60px
font weight: 700 (bold)
line height: 76px

H2 Headings

font size: 40px
font weight: 700 (bold)
line height: 54px

H3 Headings

font size: 24px
font weight: 700 (bold)
line height: 30px

H4 Headings

font size: 18px
font weight: 700 (bold)
line height: 24px

H5 Headings

font size: 14px
font weight: 700 (bold)
line height: 20px

H6 Headings

font size: 12px
font weight: 700 (bold)
line height: 18px

This is a subhead.

font size: 24px
font weight: 300 (light)
line height: 36px

This is a regular (small) paragraph.

font size: 16px
font weight: 400 (normal)
line height: 22px

This is a medium paragraph.

font size: 18px
font weight: 400 (normal)
line height: 28px

This is a large paragraph.

font size: 20px
font weight: 400 (normal)
line height: 30px

Colors

SolarKal Yellow

#FFFF00

SolarKal Green

#228B22

SolarKal Blue

#253746

Logo Orange

#F6DA4B

Black

#000000

White

#FFFFFF

Rich Text (Blogs)

Rich text default paragrah data-

font size: 18px, line height: 32px, bottom margin: 20px

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

Subscript

Buttons

Default Button

border radius: 50px
border width: 1px
font size: 18px
line height: 23px
padding: 32px left-right, 12px top-bottom

Button Text

Default Outline

border radius: 50px
border width: 1px
font size: 18px
line height: 23px
padding: 32px left-right, 12px top-bottom

Button Text

Blue Button

border radius: 50px
border width: 1px
font size: 18px
line height: 23px
padding: 32px left-right, 12px top-bottom

Button Text

Blue Outline

border radius: 50px
border width: 1px
font size: 18px
line height: 23px
padding: 32px left-right, 12px top-bottom

Button Text

Miscellaneous

Big Data Number

123

font size: 120px
font weight: 800 (extra bold)
line height: 120px

Medium Data Number

456

font size: 90px
font weight: 800 (extra bold)
line height: 90px

Form blocks

font size: 16px
font weight: 700 ( bold)
line height: 22px

font size: 16px
placeholder font color: #A3A3A3
font weight: 400 ( normal)
line height: 22px

* required

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

Logo Usage Guidelines

The SolarKal logo is a vital element of our brand identity, symbolizing our commitment to delivering innovative solar solutions. It represents our values, our brand, and our services at a glance. These guidelines are designed to ensure consistent and proper use of our logo across all platforms and materials.

Do's:
Maintain Proportions: Always scale the logo proportionally. Do not stretch or compress the logo.
Use Approved Colors: Utilize the logo in its original colors, unless in cases where monochrome is necessary.
Clear Space: Ensure the logo has sufficient clear space around it, free from text or other graphical elements. A minimum of 20px padding around each side of the logo has been used consistently throughout this website.
Use High-Quality Versions: Always use the highest resolution available to maintain the logo's integrity.

Don'ts:
Alter the Design: Do not modify the logo's design, colors, or elements in any way.
Overlay on Busy Backgrounds: Avoid placing the logo over patterns or images that impair its visibility.
Use Outdated Versions: Always use the most current version of the logo provided.
Apply Special Effects: Do not add drop shadows, glows, or any other effects to the logo.