Typography
One of the most underestimated elements of design is typography. However, it’s critical in both print and web media. We Made it Perfect in both.
Fonts
a
Heading
a
Body text
8
Numeric
a
article body
a
interface text
Headlines
Headline 1
The magical wizard quickly jinxed the gnomes before they vaporized. Quick fox jumps nightly above wizard.
headline 2
The magical wizard quickly jinxed the gnomes before they vaporized. Quick fox jumps nightly above wizard.
Headline 3
The magical wizard quickly jinxed the gnomes before they vaporized. Quick fox jumps nightly above wizard.
Title 1
Forsaking monastic tradition, twelve jovial friars gave up their vocation for a questionable existence on the flying trapeze. Bawds jog, flick quartz, vex nymph.
Title 2
Forsaking monastic tradition, twelve jovial friars gave up their vocation for a questionable existence on the flying trapeze. Bawds jog, flick quartz, vex nymph.
Subtitle
Jaded zombies acted quietly but kept driving their oxen forward. Forsaking monastic tradition, twelve jovial friars gave up their vocation for a questionable existence on the flying trapeze.
Paragrapghs
Body 1
We quickly seized the black axle and just saved it from going past him. No kidding, Lorenzo called off his trip to visit Mexico City just because they told him the conquistadores were extinct. We promptly judged antique onyx buckles for the next prize.
Body 2
We quickly seized the black axle and just saved it from going past him. No kidding, Lorenzo called off his trip to visit Mexico City just because they told him the conquistadores were extinct. We promptly judged antique onyx buckles for the next prize.
Overline
Feature
Article body
The great flood-gates of the wonder-world swung open, and in the wild conceits that swayed me to my purpose, two and two there floated into my inmost soul, endless processions of the whale, and, mid most of them all, one grand hooded phantom, like a snow hill in the air.
quote
“The freedom to build a website limited only by your imagination”
Number
1234567890
Utilities
One of the most underestimated elements of design is typography. However, it’s critical in both print and web media. We Made it Perfect in both.
word-wrap: break-word; will be your best friend.
Delete Tag
This tag will let you <strike> instead).
Emphasize Tag
The emphasize tag should italicize text.
Insert Tag
This tag should denote inserted text.
Keyboard Tag
This scarsly known tag emulates keyboard text, which is usually styled like the <code> tag.
Preformatted Tag
This tag styles large blocks of code.
.post-title {
margin: 0 0 5px;
font-weight: bold;
font-size: 38px;
line-height: 1.2;
}
Quote Tag
Developers, developers, developers…–Steve Ballmer Strong Tag This tag shows bold text. Subscript Tag Getting our science styling on with H2O, which should push the “2” down. Superscript Tag Still sticking with science and Albert Einstein’s E = MC2, which should lift the “2” up. Teletype Tag This rarely used tag emulates teletype text, which is usually styled like the
<code> tag.
Variable Tag
This allows you to denote variables.Ordered list
- List item one
- List item one
- List item one
- List item two
- List item three
- List item four
- List item two
- List item three
- List item four
- List item one
- List item two
- List item three
- List item four
Global Colors
Color is a wonderful tool for making your website more interesting with a significant positive impact on your mood.
Individual Shades
Each individual color has auto generated color shades, These can be used for events like button hover and click color changes through Kepler builder
Base Color
Base Color
Base Color
Base Color
Base Color
Base Color
Forms
Text Boxes
Buttons
Tables
Simplicity and user-freindliness define our stylized Tables, with the layout enabling any observer to grasp the basic information at a glance.
| Employee | Salary | |
|---|---|---|
| John Doe | $1 | Because that’s all Steve Jobs needed for a salary. |
| Jane Doe | $100K | For all the blogging she does. |
| Fred Bloggs | $100M | Pictures are worth a thousand words, right? So Jane x 1,000. |
| Jane Bloggs | $100B | With hair like that?! Enough said… |
Media
Images
Select any image from your media library and apply an style below. Thumbnails add margin and are used mostly for features and interactive style give a hover and active effects
Image holder
Thumbnail
Interactive
Videos
Link videos as easy as copy and pasting the video link URL. Kepler builder supports adding videos through Youtube or Vimeo.
Video Holder
Featured
Maps
Select any image from your media library and apply an style below. Thumbnails add margin and are used mostly for features and interactive style give a hover and active effects
standard 1
standard 2
standard 3
Light
Silver
Retro
dark
standard 3
Aubergine
Sliders
Select any image from your media library and apply a style below. Thumbnails add margin and are used mostly for features and interactive style give a hover and active effects