Hero Gradient

A tren in professional web desugn is to use poster style text in the hero item with a solid color or gradient background.
The ThemeKit UI Gradient Hero follows this trend and adds a two, three or four color grafient backgound with adjustable gradient angle and color stops.
This type of hero will download a lot faster than one with and image.

Animation

The heading, text and links can animate in with a simple swing up, in or down animation with controls for direction, initial scale time and delay.

Info Card Grid

ThemeKit UI Info Cards 1
Info Cards

Grid

Auto

No media queries to adjust to different browser/device screen widths.

Tel: 012 345 6789

ThemeKit UI Info Cards 2
Action

Active

Click/Tap

The on load visible area acts as a trigger to slide down the concealed content.

Tel: 012 345 6788

ThemeKit UI Info Cards 2
Links

Options

Icon Links

Spam protected email, phone number/phone call & info link are optional

Tel: 012 345 6788

ThemeKit UI Info Cards 3
Trigger

Icon

CSS Icon

The trigger's icon at the top right changes state between open and close.

Tel: 012 345 6786

ThemeKit UI Info Cards 5
Overlay

Content

Styled Span

Items have a heading, an optional styled span, text and an optional internal/external link.

Tel: 012 345 6785

ThemeKit UI Info Cards 5
Setup

Editing

EverWeb

The items in the text panel can be made visible for editing on the EverWeb design canvas.

Tel: 012 345 6785

Card Grid

The ThemeKit UI Info Card Grid has a lot of options and uses in a compact grid that helps to reduce on load content for the benefit of small mobile device users..

Animation

The overlay slides down on clicking/tapping the image or the icon at the top right. The overlay will close on clicking/tapping the action icon, outside the text area or opening another item.