This theme uti­lizes the lat­est fea­tures of the fast and slick Warp theme frame­work. It comes with a broad range of lay­out and mod­ule vari­a­tions as well as a neat typog­ra­phy to style your con­tent. Read on to learn more about this theme and its features:

  • Avail­able for Joomla and WordPress
  • 8 style vari­a­tions available
  • Choose from 13 fonts
  • 4 mod­ule style com­bin­able with 4 badges and 6 icons
  • White back­ground for sys­tem out­put (optional)
  • Smooth CSS ani­ma­tions (optional)
  • White back­ground for sys­tem out­put (optional)
  • Cus­tom CSS3 classes for trans­form and opac­ity effects
  • Flex­i­ble tem­plate and col­umn widths
  • All Warp frame­work fea­tures are available

Easy Instal­la­tion and Customization

Demo Packages

Demo Pack­ages

We pro­vide demo pack­ages with the theme sam­ple data for Joomla and Word­Press to get you started right.

Image Sources

Image Sources

Sliced and editable Adobe Fire­works image source files are avail­able to cus­tomize the theme easily.

Theme Styles

We pro­vide dif­fer­ent style vari­a­tions of the default theme. In addi­tion to these styles we added sev­eral other style set­tings like col­ors and fonts. Com­bin­ing the dif­fer­ent style options allows you to cre­ate your own unique theme design.

Combinable Styles

Theme Pro­files

We cre­ated some nice theme pro­files using the dif­fer­ent styles, col­ors and fonts, you can choose from in the theme admin­is­tra­tion. You can cre­ate your own pro­files and even assign them to dif­fer­ent menu items. Click on one of the pro­file images to load it.

Theme Lay­out

This theme comes with the default Warp6 mod­ule lay­out. The blue mod­ule posi­tions allow to choose a mod­ule lay­out which defines the mod­ule align­ment and pro­por­tions: equal, dou­ble or stack. You can eas­ily add your own mod­ule lay­outs. The two avail­able side­bars, high­lighted in red, can be switched to the left or right side and their widths can eas­ily be set in the theme admin­is­tra­tion. For mod­ules in the blue and red posi­tions you can choose dif­fer­ent mod­ule styles. Take a look at the mod­ule vari­a­tions page to get an overview.

Module Positions

Mod­ule Posi­tions
Module Layouts

Mod­ule Lay­outs
Colum Layouts

Col­umn Lay­outs

Custom Widgetkit Styles

We cre­ated some cus­tom styles for our Wid­getkit Slideshow Tabs and Wid­getkit Slideset, per­fectly fit­ting to the theme. To apply this styles, fol­low these steps:

Slideshow Tabs

  1. Down­load and unzip the bonus styles pack­age for Wid­getkit avail­able in the down­load area.
  2. Copy the folder slideshow/styles/steam_tabs.
  3. Joomla: Paste it to media/widgetkit/widgets/slideshow/styles.
    Word­Press: Paste it to wp-content/plugins/widgetkit/widgets/slideshow/styles.
  4. Now you can select the style “Steam tabs” in the set­tings of your Wid­getkit Slideshow.


  1. Down­load and unzip the bonus styles pack­age for Wid­getkit avail­able in the down­load area.
  2. Copy the folder slideset/styles/steam.
  3. Joomla: Paste it to media/widgetkit/widgets/slideset/styles.
    Word­Press: Paste it to wp-content/plugins/widgetkit/widgets/slideset/styles.
  4. Now you can select the style “Steam” in the set­tings of your Wid­getkit Slideset.

Additional Theme Features

Hor­in­zon­tal Rules

You can use the <hr class="stars" /> to insert a styled hor­i­zon­tal rule.

For another style hor­i­zon­tal rule, you can also use <hr class="line" />.

Cus­tom CSS3 ani­mated Classes

We’ve added two cus­tom classes which will work when you have enabled the ani­ma­tions fea­ture in the Warp back­end interface.

.steam-zoom cre­ates a CSS3 transform-scale ani­ma­tion on mouse hover.

.steam-opacity cre­ates a fade in / fade out CSS3 tran­si­tion ani­ma­tion on mouse hover.