X-Cart reBOOT Testing Ground

This is a place to demonstrate some of the template features & widgets.

Last Updated: August 9th 2020

Validate HTML Markup

New v4.4 responsive Row Columns method...

Col 1/4
Col 2/4
Col 3/4
Col 4/4

Col 1/4
Col 2/4
Equal-width columns can be broken into multiple lines
Col 3/4
Col 4/4

Col 1/2
Col 2/2
Col 1/3
Col 2/3
Col 3/3
Col 1/4
Col 2/4
Col 3/4
Col 4/4
Col 1/5
Col 2/5
Col 3/5
Col 4/5
Col 5/5
Col 1/3 No Gutter
Col 2/3 No Gutter
Col 3/3 No Gutter
Col 1/2 Left
Col 2/2 Left
Col 1/2 Centered
Col 2/2 Centered
Col 1/2 Right
Col 2/2 Right
Col 1/2 Right
Col 2/2 Left
Col 1/2 Right
Col 2/2 Left
Col 1/3 align-items-start
Col 2/3 align-items-start
Col 3/3 align-items-start
Col 1/3 align-items-center
Col 2/3 align-items-center
Col 3/3 align-items-center
Col 1/3 align-items-end
Col 2/3 align-items-end
Col 3/3 align-items-end
Col 1/3 align-self-start
Col 2/3 align-self-center
Col 3/3 align-self-end
Col 1/1 justify-content-between
Col 2/2 justify-content-between

Column Reordering

LEFT
CENTER
RIGHT

Equal Height Column Borders

Column 1

Column 2

Column 3

Column OR Separators

OR

OR

Column Stretching

Isotope Grids

Isotope allows you to create cascading, masonry (or Pinterest) style layouts, in conjunction with the Bootstrap grid.

Isotope Grids 1

1
2
3
4
5
6
7

Isotope Grids 2

1
2
3
4
5
6
7
8

Isotope Style 1

Isotope Style 2

Title 1

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent sed nisl vehicula, pharetra augue quis, sodales tellus. Suspendisse ut dui est. Ut placerat sodales commodo. Nunc libero erat, efficitur a nulla quis, aliquam molestie elit. Sed consectetur euismod tortor. Praesent ultrices volutpat quam, eget bibendum metus viverra vel.

Title 2

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent sed nisl vehicula, pharetra augue quis, sodales tellus. Suspendisse ut dui est. Ut placerat sodales commodo. Nunc libero erat, efficitur a nulla quis, aliquam molestie elit. Sed consectetur euismod tortor. Praesent ultrices volutpat quam, eget bibendum metus viverra vel.

Title 3

Lorem ipsum dolor sit amet, consectetur adipiscing elit.

Title 4

Lorem ipsum dolor sit amet, consectetur adipiscing elit.

Title 5

Lorem ipsum dolor sit amet, consectetur adipiscing elit.

Isotope Style 3

Title 1

Lorem ipsum dolor sit amet, consectetur adipiscing elit.

Title 2

Lorem ipsum dolor sit amet, consectetur adipiscing elit.

Title 3

Lorem ipsum dolor sit amet, consectetur adipiscing elit.

Title 4

Lorem ipsum dolor sit amet, consectetur adipiscing elit.

Title 5

Lorem ipsum dolor sit amet, consectetur adipiscing elit.

Isotope Style 4

1/4 Width

3/4 Width

1/4 Width

1/2 Width

1/2 Width

Isotope Style 5

1/2 Width, Tall

1/2 Width

1/4 Width

1/4 Width

Isotope Style 6

1/4 Width

1/4 Width

1/4 Width

1/4 Width

Isotope Style 7

1/4 Width, Tall

1/2 Width

1/4 Width, Tall

1/4 Width

1/4 Width

Isotope Style 8

1/4 Width

3/4 Width

Isotope Style 9

3/4 Width

1/4 Width

Isotope Style 10

1/3 Width

1/3 Width

1/3 Width

Isotope Style 11

1/5 Width

1/5 Width

1/5 Width

1/5 Width

1/5 Width

Paginated Isotope

Typography

h1. Bootstrap heading

h2. Bootstrap heading

h3. Bootstrap heading

h4. Bootstrap heading

h5. Bootstrap heading
h6. Bootstrap heading

h1. Bootstrap heading

h2. Bootstrap heading

h3. Bootstrap heading

h4. Bootstrap heading

h5. Bootstrap heading

h6. Bootstrap heading

Display 1

Display 2

Display 3

Display 4

Display 1

Display 2

Display 3

Display 4

Fancy display heading With faded secondary text

Lead Paragraph, vivamus sagittis lacus vel augue laoreet rutrum faucibus dolor auctor. Duis mollis, est non commodo luctus.

You can use the mark tag to highlight text.

This line of text is meant to be treated as deleted text.

This line of text is meant to be treated as no longer accurate.

This line of text is meant to be treated as an addition to the document.

This line of text will render as underlined

This line of text is meant to be treated as fine print.

This line rendered as bold text.

This line rendered as italicized text.

attr

HTML

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer posuere erat a ante.

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer posuere erat a ante.

Someone famous in Source Title

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer posuere erat a ante.

Someone famous in Source Title

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer posuere erat a ante.

Someone famous in Source Title

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Maecenas consectetur tellus sit amet mollis luctus.Praesent accumsan ante quis ex pulvinar molestie. Nam et rhoncus arcu. Curabitur massa est, venenatis ac felis vel, luctus aliquam neque. Phasellus maximus mollis mi consectetur ultrices. Aenean ante massa, maximus a bibendum vel, suscipit eu nulla. Aliquam eleifend, ex id condimentum volutpat, magna mauris pharetra augue, accumsan malesuada orci velit eu lorem. Morbi rutrum fermentum accumsan.

Proin pellentesque ultrices erat quis sagittis. Mauris consectetur volutpat arcu a egestas. Pellentesque laoreet purus non feugiat placerat. In nec justo ut eros pellentesque convallis. Duis vitae suscipit urna, nec iaculis nisi. Proin sed tortor vitae ex porta ornare sed in augue. Pellentesque augue arcu, venenatis ac odio et, viverra mollis quam.

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Maecenas consectetur tellus sit amet mollis luctus.Praesent accumsan ante quis ex pulvinar molestie. Nam et rhoncus arcu. Curabitur massa est, venenatis ac felis vel, luctus aliquam neque. Phasellus maximus mollis mi consectetur ultrices. Aenean ante massa, maximus a bibendum vel, suscipit eu nulla. Aliquam eleifend, ex id condimentum volutpat, magna mauris pharetra augue, accumsan malesuada orci velit eu lorem. Morbi rutrum fermentum accumsan.

Proin pellentesque ultrices erat quis sagittis. Mauris consectetur volutpat arcu a egestas. Pellentesque laoreet purus non feugiat placerat. In nec justo ut eros pellentesque convallis. Duis vitae suscipit urna, nec iaculis nisi. Proin sed tortor vitae ex porta ornare sed in augue. Pellentesque augue arcu, venenatis ac odio et, viverra mollis quam.

  • Lorem ipsum dolor sit amet
  • Consectetur adipiscing elit
  • Integer molestie lorem at massa
  • Facilisis in pretium nisl aliquet
  • Nulla volutpat aliquam velit
    • Phasellus iaculis neque
    • Purus sodales ultricies
    • Vestibulum laoreet porttitor sem
    • Ac tristique libero volutpat at
  • Faucibus porta lacus fringilla vel
  • Aenean sit amet erat nunc
  • Eget porttitor lorem
  • Lorem ipsum
  • Phasellus iaculis
  • Nulla volutpat
  • Item 1
  • Item 2
  • Item 3
  • Item 4
  • Item 5
  • Lorem ipsum dolor
  • Lorem ipsum dolor
  • Lorem ipsum dolor
  • Lorem ipsum dolor
  • Lorem ipsum dolor
  • Lorem ipsum dolor
  • Lorem ipsum dolor
  • Lorem ipsum dolor
  • Lorem ipsum dolor
  • Lorem ipsum dolor
  • Lorem ipsum dolor
  • Lorem ipsum dolor
  • Lorem ipsum dolor
  • Lorem ipsum dolor
  • Lorem ipsum dolor
  • Lorem ipsum dolor
  • Lorem ipsum dolor
  • Lorem ipsum dolor
  • Lorem ipsum dolor
  • Lorem ipsum dolor
  • Lorem ipsum dolor
  • Lorem ipsum dolor
  • Lorem ipsum dolor
  • Lorem ipsum dolor
  • Lorem ipsum dolor
  • Lorem ipsum dolor
  • Lorem ipsum dolor
  • Lorem ipsum dolor
  • Lorem ipsum dolor
  • Lorem ipsum dolor
  • Lorem ipsum dolor
  • Lorem ipsum dolor
  • Lorem ipsum dolor
  • Lorem ipsum dolor
  • Lorem ipsum dolor
  • Lorem ipsum dolor
  • Lorem ipsum dolor
  • Lorem ipsum dolor
  • Lorem ipsum dolor
  • Lorem ipsum dolor
  • Lorem ipsum dolor
  • Lorem ipsum dolor
  • Lorem ipsum dolor
  • Lorem ipsum dolor
  • Lorem ipsum dolor
  • Lorem ipsum dolor
  • Lorem ipsum dolor
  • Lorem ipsum dolor
  • Lorem ipsum dolor
  • Lorem ipsum dolor
  • Lorem ipsum dolor
  • Lorem ipsum dolor
  • Lorem ipsum dolor
  • Lorem ipsum dolor
  • Lorem ipsum dolor
  • Lorem ipsum dolor
  • Lorem ipsum dolor
  • Lorem ipsum dolor
  • Lorem ipsum dolor
  • Lorem ipsum dolor
  • Lorem ipsum dolor
  • Lorem ipsum dolor
  • Lorem ipsum dolor
  • Lorem ipsum dolor
  1. Lorem ipsum dolor
  2. Lorem ipsum dolor
  3. Lorem ipsum dolor


























Groovy Underline Rainbow 1

Groovy Underline Rainbow 2

Groovy Underline Tapered 1

Groovy Underline Tapered 2

Buttons

Dropdowns

Badges

Example heading New

Example heading New

Example heading New

Example heading New

Example heading New
Example heading New
Primary Secondary Success Danger Warning Info Light Dark
Primary Secondary Success Danger Warning Info Light Dark

Speech Bubbles

Alerts

Toasts

Uses SweetAlert2

Copy to Clipboard

Alerts

Uses SweetAlert2

Tooltips

Popovers

Custom Dynamic Modals

Simple Dynamic Modal

Bootstrap Top Bottom & Side Modals

Subheaders - Style 1

Default Subheader

Default Subheader

Default Subheader

Blue Subheader

Blue Subheader

5 Blue Subheader

Indigo Subheader

Indigo Subheader

1 Indigo Subheader

Purple Subheader

Purple Subheader

7 Purple Subheader

Pink Subheader

Pink Subheader

6 Pink Subheader

Red Subheader

Red Subheader

4 Red Subheader

Orange Subheader

Orange Subheader

4 Orange Subheader

Yellow Subheader

Yellow Subheader

4 Yellow Subheader

Green Subheader

Green Subheader

3 Green Subheader

Teal Subheader

Teal Subheader

9 Teal Subheader

Cyan Subheader

Cyan Subheader

6 Cyan Subheader

Subheaders - Style 2

Blue Subheader

Blue Subheader

10 Blue Subheader

Indigo Subheader

Indigo Subheader

6 Indigo Subheader

Purple Subheader

Purple Subheader

6 Purple Subheader

Pink Subheader

Pink Subheader

5 Pink Subheader

Red Subheader

Red Subheader

7 Red Subheader

Orange Subheader

Orange Subheader

5 Orange Subheader

Yellow Subheader

Yellow Subheader

8 Yellow Subheader

Green Subheader

Green Subheader

4 Green Subheader

Teal Subheader

Teal Subheader

7 Teal Subheader

Cyan Subheader

Cyan Subheader

10 Cyan Subheader

Dividers

Fade Divider Dark

Lorem Ipsum Dolor

Lorem Ipsum Dolor

Fade Divider Light

Lorem Ipsum Dolor

Lorem Ipsum Dolor

Dialogs & Menus

Dialog Title

Dialog Title

Dialog Title

Menu Title

Menu Title

Menu Title


{capture name=dialog}
Content
{/capture}
{include file="customer/dialog.tpl" title="Dialog Title" content=$smarty.capture.dialog heading="2" title_padding="3" content_padding="3" border="primary" bg="primary" text="light" icon="star"}

{capture name=menu}
Content
{/capture}
{include file="customer/menu_dialog.tpl" title="Menu Title" content=$smarty.capture.menu content_padding="2" heading="2" title_padding="3" content_padding="3" border="primary" bg="primary" text="light" icon="star"}

Bootstrap Dialog Accordions

Dialogs can easily transform into accordions with a little extra code.

One Open At A Time

Alternate Icon & Positioning

Accordions Using X-Tabs

Accordions Using Details & Summary Elements

Free choice...

Accordion Item 1

Lorem ipsum dolor sit amet.

Accordion Item 2

Lorem ipsum dolor sit amet.

Accordion Item 3

Lorem ipsum dolor sit amet.

Open open at a time...

Accordion Item 1

Lorem ipsum dolor sit amet.

Accordion Item 2

Lorem ipsum dolor sit amet.

Accordion Item 3

Lorem ipsum dolor sit amet.

reBOOT X-Tabs

Our homebrew responsive X-Tabs are the easiest to implement, which convert to accordions on small devices. Another good feature is that you can link directly to a tab using it's named anchor.

Bootstrap Tabs

Cards

Card Header
Card Mini Header

Card Title

Call to Action

Card Title

Call to Action

Cards with Ribbons

Card Hover Effect

Card with hover effect
Card with hover effect
Card with hover effect

Match Heights

Matched Height

Matched Height

Matched Height

Matched Height

Matched Height

Matched Height

Card Deck

Card Deck

Card Deck

Card Deck

Card Deck

Card Deck

Card Deck

Card Group

Card Group

Card Group

Card Group

Card Group

Card Group

Card Group

Card Columns

Card Column

Card Column

Card Column

Card Column

Card Column

Card Column

Card Column

Card Column

Card Column

Card Column

Card Column

Card Column

Card Column

Card Column

Flip Cards

On Hover

Front Side

Top

Back Side

Top

Front Side

Right

Back Side

Right

Front Side

Bottom

Back Side

Bottom

Front Side

Left

Back Side

Left

On Click

Front Side

Top

Back Side

Top

Front Side

Right

Back Side

Right

Front Side

Bottom

Back Side

Bottom

Front Side

Left

Back Side

Left

On Button Click

Front Side

Top

Back Side

Top

Front Side

Right

Back Side

Right

Front Side

Bottom

Back Side

Bottom

Front Side

Left

Back Side

Left

Auto Flip - Same Time

Front Side

Top

Back Side

Top

Front Side

Right

Back Side

Right

Front Side

Bottom

Back Side

Bottom

Front Side

Left

Back Side

Left

Auto Flip - Different Times

Front Side

Top

Back Side

Top

Front Side

Right

Back Side

Right

Front Side

Bottom

Back Side

Bottom

Front Side

Left

Back Side

Left

Get Creative!

Big Buck Bunny


Images


16:9

<div class="wrapper-16-9">...</div>

320x180 / 480x270 / 575x323 / 640x360 / 800x450 / 960x540 / 1024x576 / 1280x720 / 1366x768 / 1600x900 / 1920x1080

4:3

<div class="wrapper-4-3">...</div>

320x240 / 480x360 / 575x431 / 640x480 / 800x600 / 1024x768

3:2

<div class="wrapper-2-1">...</div>

330x120 / 720x240 / 861x287 / 960x320 / 1200x400 / 1536x512

2:1

<div class="wrapper-2-1">...</div>

320x120 / 480x240 / 575x287 / 640x320 / 800x400 / 1024x512
Image 1
Image 2
Image 3
Image 4
Image 1
A caption for the above image.
Image 2
A caption for the above image.
Image 3
A caption for the above image.
Image 4
A caption for the above image.

Image 1
Image 2
Image 3
Image 4

Responsive Lazyloading using PICTURE

PICTURE is the preferred method for responsive lazyloaded images. Resize the browser and you'll see the image change...

Responsive Lazyloading using SRCSET

SRCSET is the alternative method, usually used for images with the same aspect ratio...

Individual Lightboxes

Use the class .lightbox on the hyperlink.

Lightbox Button


Image 1
Image 2
Image 3
Image 4

Lightbox Group

Use the class .lbox on the parent container.

Lightbox Group Button


Image 1
Image 2
Image 3
Image 4

Image Zoom, Same Image

Image 1
Image 2
Image 3
Image 4

Image Zoom, Alternative Image

Image 1
Image 2
Image 3
Image 4

Image Hover Effects

44 hover effects available.

Lorem ipsum dolor sit amet

Lorem ipsum dolor

More...
Lorem ipsum dolor sit amet

Lorem ipsum dolor

More...
Lorem ipsum dolor sit amet

Lorem ipsum dolor

More...
Lorem ipsum dolor sit amet

Lorem ipsum dolor

More...

Simple Image Switch on Hover

Image 1
Image 1
Image 1
Image 1

Image Switch on Hover & Link Icon

Image Zoom on Hover & Link Icon

Image 1
Image 2
Image 3
Image 4

Watermarked Images

Image or textual watermarking. Various positions are possible also. Watermarking is done on-the-fly, as such images cannot be lazyloaded.

This feature offers basic image protection. Obviously it's best to watermark your images to begin with, using your photo editing software.

Watermarked
Watermarked
Watermarked
Watermarked

Image Labels

No Effect...

Fade In Effect...

Float In Effect, Light...


You can in fact label pretty much anything, like this card...

Before & After

Drag the handle to show before & after images...

Before After

{include file="custom/widgets/widget_before_after.tpl" before="before.jpg" after="after.jpg" width="640" height="480" before_alt="Before" after_alt="After"}

360 Degree View

Drag the image...

Loading...

360 Degree View

{include file="custom/widgets/widget_360.tpl" folder="mini" image="mini" ext="jpg" count="36"}

Unsplash Placeholder Images

Royalty free images.

Unsplash
Unsplash
Unsplash
Unsplash
Unsplash

People Placeholder Images

Vertical Nav Tabs Promo

Promo Top Left Light

Lorem Ipsum is simply dummy text
of the printing and typesetting industry.

Shop Now

Promo Top Center Dark

Lorem Ipsum is simply dummy text
of the printing and typesetting industry.

Shop Now

Promo Top Right Light

Lorem Ipsum is simply dummy text
of the printing and typesetting industry.

Shop Now

Promo Center Right Dark

Lorem Ipsum is simply dummy text
of the printing and typesetting industry.

Shop Now

Promo Bottom Right Light

Lorem Ipsum is simply dummy text
of the printing and typesetting industry.

Shop Now

Promo Bottom Center Dark

Lorem Ipsum is simply dummy text
of the printing and typesetting industry.

Shop Now

Promo Bottom Left Light

Lorem Ipsum is simply dummy text
of the printing and typesetting industry.

Shop Now

Promo Center Left Dark

Lorem Ipsum is simply dummy text
of the printing and typesetting industry.

Shop Now

Promo Center Center Light

Lorem Ipsum is simply dummy text
of the printing and typesetting industry.

Shop Now

Lorem Ipsum is simply dummy text of the printing and typesetting industry.

Promo Coupon Blocks

SPRING 10% OFF

SUMMER $20 OFF

WINTER $10 OFF

BLACK FRIDAY 15% OFF

Article Posts

SVG Wave Dividers / Hero Sections

Promo Title

Call to Action

Angled Gradient Background

Build fast, responsive sites with reBOOT

Quickly design and customize responsive mobile-first sites with Bootstrap, the world's most popular front-end open source toolkit, featuring a responsive grid system, extensive prebuilt components, and powerful JavaScript plugins.

Currently v4.7.12

Build fast, responsive sites with reBOOT

Quickly design and customize responsive mobile-first sites with Bootstrap, the world's most popular front-end open source toolkit, featuring a responsive grid system, extensive prebuilt components, and powerful JavaScript plugins.

Currently v4.7.12

Basic

New Summer 2020 Collection

Shop Now

Enjoy an Extra

50% OFF

Shop Summer

Promo Hero Banners

4 Styles, static or fixed background.

Hero Title

Subtitle Lorem ipsum dolor sit amet...

Shop Now

Hero Title

Subtitle Lorem ipsum dolor sit amet...

Shop Now

Hero Title

Subtitle Lorem ipsum dolor sit amet...

Hero Title

Subtitle Lorem ipsum dolor sit amet...

Hero Title

Subtitle Lorem ipsum dolor sit amet...

Hero Title

Subtitle Lorem ipsum dolor sit amet...

Promo Blocks

Light / dark captions, half / full / auto width & height captions.

Promo Title

Promo Subtitle

Call to Action

Promo Title

Promo Subtitle

Call to Action

Promo Title

Promo Subtitle

Call to Action

Promo Title

Promo Subtitle

Call to Action

Promo Title

Promo Subtitle

Call to Action

Promo Title

Promo Subtitle

Call to Action

Promo Title

Promo Subtitle

Call to Action

Promo Title

Promo Subtitle

Call to Action

Promo Title

Promo Subtitle

Call to Action

Breakout Promos

I'm a stretched DIV with gradient background

Shop Now

I'm a stretched DIV with an image background

Shop Now

I'm a stretched DIV with a fixed image background

Shop Now

Angled Hero Sections

HERO DIAGONAL BOTTOM

Lorem Ipsum is simply dummy text of the printing and typesetting industry.

Call to Action

HERO DIAGONAL TOP & BOTTOM

Lorem Ipsum is simply dummy text of the printing and typesetting industry.

Call to Action

HERO DIAGONAL TOP

Lorem Ipsum is simply dummy text of the printing and typesetting industry.

Call to Action

Angled Promos Clip Path

Section Content 1

Call to Action

Section Content 2

Call to Action

Section Content 3

Call to Action

Section Content 4

Call to Action

Angled Promos Skew

Section Content 1

Call to Action

Section Content 2

Call to Action

Section Content 3

Call to Action

Section Content 4

Call to Action

Carousels













Bestsellers


Featured Categories


Featured Manufacturers


Latest from the Blog


Featured Manufacturers


Video Embeds

Optional YouTube Video Title

Optional Vimeo Video Title

MP4 Video Embeds

Promo MP4 - Autoplay - Looped - Muted

Video Title

Video Subtitle Lorem Ipsum Dolor

Call to Action

Video Lightboxes

Modal Video

Video 1 Caption
Video 2 Caption
Video 3 Caption
Video 4 Caption

Video Carousel

YouTube Feeds from Username

Requires a YouTube API key (template settings > Misc) and is subject to daily limits. No display = daily limit reached.

YouTube Playlists from Playlist ID

Requires a YouTube API key (template settings > Misc) and is subject to daily limits. No display = daily limit reached.

Single MP3s

Play Bottom Opening Theme Modal Audio

Play Play Play Play Play Play Play Play Play Play Play Play

Individual Track
Optional description...
Individual Track with Image
Individual Track with Image
Optional description...

Individual Track in a Dialog Box

Optional description...

Individual Track in a Dialog Box with Image

Individual Track in a Dialog Box with Image
Optional description...

Individual Track in a Dialog Box with Image

Individual Track in a Dialog Box with Image
Optional description...

MP3 Playlist

1. Computer World
First track...
2. Pocket Calculator
3. Numbers
4. Computer World 2
5. Computer Love
6. Home Computer
7. It's More Fun To Compute

Dynamic Image Gallery

{include file="custom/widgets/widget_image_gallery.tpl" id="test-gallery-1" folder="uploads/gallery" thumb_width="200" images="8"}

Isotope Portfolio

Gallery Grid

Brick Masonry

Animation Classes

Animate.css

Rotate Some Texts

reBOOT is Fast|is SEO Friendly|is Bootstrap 4 Based|is Inexpensive|is Awesome

New York|London|Paris|Munich|Everybody talk about|Pop musik

New York|London|Paris|Munich|Everybody talk about|Pop musik

New York|London|Paris|Munich|Everybody talk about|Pop musik

Advanced Rotate Texts

List based, so more SEO friendly...

Welcome to  

  • New York
  • London
  • Paris
  • Munich

I love   in the summertime.

  • New York
  • London
  • Paris
  • Munich

 

  • New York
  • London
  • Paris
  • Munich
  • Everybody talk about
  • Pop musik

Typewriter

  

Icons

Images

Animate any element, including images, as they appear in the viewport.

Unsplash
Unsplash
Unsplash
Unsplash
Unsplash
Unsplash
Unsplash
Unsplash
Unsplash

Animate Once or Repeat

fadeIn Once

fadeInLeft Once

fadeInRight Once


bounceIn Repeat

bounceInLeft Repeat

bounceInRight Repeat

Pure CSS Spinners

Image Spinners

Loading...
Loading...
Loading...
Loading...
Loading...
Loading...
Loading...
Loading...
Loading...
Loading...
Loading...
Loading...
Loading...
Loading...
Loading...
Loading...

3 Column Responsive

*
*
*
*
*
 
 
 
 

2 Column Responsive

 

Card Responsive Table

Card Header
# First Last Handle
1 Mark Otto @mdo
2 Jacob Thornton @fat
3 Larry the Bird @twitter

Floating Labels

Data List


Predictive Search

Popular Searches

Tags

Search By Price

£
To
£

Social Sharing

Social Profile links, style 1...


Share links...


Twitter, Facebook, LinkedIn & Email Buttons...


Featured Categories


Featured Categories

Featured Categories

Books

Books

Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of ...

Food & Drink

Food & Drink

Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of ...

Clothes

Clothes

Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of ...

Toys

Toys

Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of ...

Audio & Video

Audio & Video

Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of ...

Home & Garden

Home & Garden

Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of ...



Featured Manufacturers

Featured Manufacturers

Armani Jeans

Armani Jeans

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec efficitur suscipit sem vitae auctor. Integer magna nunc, commodo vitae turpis sed, placerat cursus odio. Donec porttitor luctus velit ...

Bang & Olufsen

Bang & Olufsen

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec efficitur suscipit sem vitae auctor. Integer magna nunc, commodo vitae turpis sed, placerat cursus odio. Donec porttitor luctus velit ...

3 Lions

3 Lions

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec efficitur suscipit sem vitae auctor. Integer magna nunc, commodo vitae turpis sed, placerat cursus odio. Donec porttitor luctus vel...

Abercrombie & Fitch

Abercrombie & Fitch

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec efficitur suscipit sem vitae auctor. Integer magna nunc, commodo vitae turpis sed, placerat cursus odio. Donec porttitor luctus velit ...

Test Manufacturer

Test Manufacturer

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Etiam eu diam bibendum, gravida augue dictum, mattis velit. Aliquam condimentum nibh nisi, at tincidunt dolor interdum sit amet. Maecenas ma...

Addis

Addis

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec efficitur suscipit sem vitae auctor. Integer magna nunc, commodo vitae turpis sed, placerat cursus odio. Donec porttitor luctus velit ...

Accurist

Accurist

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec efficitur suscipit sem vitae auctor. Integer magna nunc, commodo vitae turpis sed, placerat cursus odio. Donec porttitor luctus velit ...

7 For All Mankind

7 For All Mankind

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec efficitur suscipit sem vitae auctor. Integer magna nunc, commodo vitae turpis sed, placerat cursus odio. Donec porttitor luctus velit ...

Armani Jeans

Bang & Olufsen

3 Lions

Abercrombie & Fitch

Test Manufacturer

Addis

Accurist

7 For All Mankind



Categories

Google Maps

Map Types: roadmap (default) / satellite / terrain / hybrid, Zoom Levels: 0-20, default 10

Store Locator

Just experimental, not used in the X-Cart address popups.

Requires a Google Maps API key in X-Cart General Settings. Subject to daily limits.



Meet the Team

Jon Doe

Company Director

Lorem Ipsum

Jane Doe

Managing Director

Lorem Ipsum

Jon Doe

Sales Director

Lorem Ipsum

Jane Doe

Senior Sales Assistant

Lorem Ipsum

Jon Doe

Junior Sales Assistant

Lorem Ipsum

Jon Doe
Support

Lorem Ipsum

Jane Doe
Support

Lorem Ipsum

Jon Doe
Senior Web Design

Lorem Ipsum

Jane Doe
Junior Web Design

Lorem Ipsum



Timeline

  • Some Event

    Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged.

    December 2020

  • Some Event

    Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged.

    November 2020

  • Some Event

    Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged.

    August 2020

  • Some Event

    Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged.

    July 2020

  • Some Event

    Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged.

    May 2020

  • Some Event

    Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged.

    April 2020



Free
$0/month

  • Single User
  • 5GB Storage
  • Unlimited Public Projects
  • Community Access
  • Unlimited Private Projects
  • Dedicated Phone Support
  • Free Subdomain
  • Monthly Status Reports
Call to Action
Plus
$9/month

  • 5 Users
  • 50GB Storage
  • Unlimited Public Projects
  • Community Access
  • Unlimited Private Projects
  • Dedicated Phone Support
  • Free Subdomain
  • Monthly Status Reports
Call to Action
Pro
$49/month

  • Unlimited Users
  • 150GB Storage
  • Unlimited Public Projects
  • Community Access
  • Unlimited Private Projects
  • Dedicated Phone Support
  • Unlimited Free Subdomains
  • Monthly Status Reports
Call to Action




Comments

Welcome, Desktop user!

Shadows

.shadow-sm
.shadow
.shadow-lg

Letter Avatars

AJ BT CP PJ RH TH WW

Gravatars

X-Cart Mods X-Cart Mods Gravatar Bloke Gravatar Bloke Not Found Not Found

Random Background Colors

Random BG Color
Random BG Color
Random BG Color
Random BG Color

Gradient Backgrounds

gradient-dark-top
gradient-dark-bottom
gradient-dark-radial
gradient-dark-left
gradient-dark-right
gradient-light-top
gradient-light-bottom
gradient-light-radial
gradient-light-left
gradient-light-right

Ribbons

Basic, any color from the palette, four positions.

TOP LEFT
Content
TOP RIGHT
Content
BOTTOM LEFT
Content
BOTTOM RIGHT
Content

Raised effect, any color from the palette, top left position only.

TOP LEFT
Content
TOP LEFT
Content
TOP LEFT
Content
TOP LEFT
Content

Truncate Text

Scrollable Content

Can be any height from 50px to 600px in 50px increments. Optional faded bottom effect.

Countdowns

Countdowns can either fade out or display a message on expiry...

Time limited offer!

Get in quick before the price increases!

Offer ending soon!

Don't let this offer get away!

Only minutes left!

Last chance!

Time Since

We launched something
Last Christmas was
Something happened
(will update in realtime...)

Count To

 

+

%

$

Animated Progress Bars


Shuffle Elements

  • List Item 1
  • List Item 2
  • List Item 3
  • List Item 4
  • List Item 5
  1. List Item 1
  2. List Item 2
  3. List Item 3
  4. List Item 4
  5. List Item 5
List Item 1
List Item 2
List Item 3
List Item 4
List Item 5

Random Numbers

{random in=1 out=1000} = 385
{"1"|mt_rand:1000} = 45

Source Code with Syntax Highlighting

Requires enabling the Prism.js Javascript and CSS (template settings > misc)

p { color: red }
var Foo = "Bar";
{include file="foo.tpl"}
truncate `foo_table`;

HTML markup and PHP can be displayed without having to convert special characters...

reBOOT Blog


Don Carlos - Livin' A Dream

Don Carlos - Livin' A Dream

Blogs Latest

During the late 1980s and 1990s, few Italian producers built up quite as strong a catalogue of dreamy, tactile and sun-kissed deep house, ambient and downtempo tracks as Don Carlos. As this fine...

Third Blog Post

Third Blog Post

Blogs Latest

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent eget nisl eget sapien tempor feugiat. Sed libero metus, condimentum eget odio vel, volutpat tincidunt nisl. Donec fringilla port...

Second Blog Post

Second Blog Post

Blogs Latest

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent eget nisl eget sapien tempor feugiat. Sed libero metus, condimentum eget odio vel, volutpat tincidunt nisl. Donec fringilla port...

First Blog Post

First Blog Post

Blogs Latest

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent eget nisl eget sapien tempor feugiat. Sed libero metus, condimentum eget odio vel, volutpat tincidunt nisl. Donec fringilla port...


Wordpress Blog

Auto File Link Icons

PDF DOC XLS TXT ZIP EXE MP3 MP4 PPT

Payment Icons


We have opted to stick with v4.7.0 rather than v5.x due to the smaller file size and ease of use.

Icon Title Icon Title Icon Title
address-book
address-book-o
address-card
address-card-o
bandcamp
bath
bathtub (alias)
drivers-license (alias)
drivers-license-o (alias)
eercast
envelope-open
envelope-open-o
etsy
free-code-camp
grav
handshake-o
id-badge
id-card
id-card-o
imdb
linode
meetup
microchip
podcast
quora
ravelry
s15 (alias)
shower
snowflake-o
superpowers
telegram
thermometer (alias)
thermometer-0 (alias)
thermometer-1 (alias)
thermometer-2 (alias)
thermometer-3 (alias)
thermometer-4 (alias)
thermometer-empty
thermometer-full
thermometer-half
thermometer-quarter
thermometer-three-quarters
times-rectangle (alias)
times-rectangle-o (alias)
user-circle
user-circle-o
user-o
vcard (alias)
vcard-o (alias)
window-close
window-close-o
window-maximize
window-minimize
window-restore
wpexplorer
address-book
address-book-o
address-card
address-card-o
adjust
american-sign-language-interpreting
anchor
archive
area-chart
arrows
arrows-h
arrows-v
asl-interpreting (alias)
assistive-listening-systems
asterisk
at
audio-description
automobile (alias)
balance-scale
ban
bank (alias)
bar-chart
bar-chart-o (alias)
barcode
bars
bath
bathtub (alias)
battery (alias)
battery-0 (alias)
battery-1 (alias)
battery-2 (alias)
battery-3 (alias)
battery-4 (alias)
battery-empty
battery-full
battery-half
battery-quarter
battery-three-quarters
bed
beer
bell
bell-o
bell-slash
bell-slash-o
bicycle
binoculars
birthday-cake
blind
bluetooth
bluetooth-b
bolt
bomb
book
bookmark
bookmark-o
braille
briefcase
bug
building
building-o
bullhorn
bullseye
bus
cab (alias)
calculator
calendar
calendar-check-o
calendar-minus-o
calendar-o
calendar-plus-o
calendar-times-o
camera
camera-retro
car
caret-square-o-down
caret-square-o-left
caret-square-o-right
caret-square-o-up
cart-arrow-down
cart-plus
cc
certificate
check
check-circle
check-circle-o
check-square
check-square-o
child
circle
circle-o
circle-o-notch
circle-thin
clock-o
clone
close (alias)
cloud
cloud-download
cloud-upload
code
code-fork
coffee
cog
cogs
comment
comment-o
commenting
commenting-o
comments
comments-o
compass
copyright
creative-commons
credit-card
credit-card-alt
crop
crosshairs
cube
cubes
cutlery
dashboard (alias)
database
deaf
deafness (alias)
desktop
diamond
dot-circle-o
download
drivers-license (alias)
drivers-license-o (alias)
edit (alias)
ellipsis-h
ellipsis-v
envelope
envelope-o
envelope-open
envelope-open-o
envelope-square
eraser
exchange
exclamation
exclamation-circle
exclamation-triangle
external-link
external-link-square
eye
eye-slash
eyedropper
fax
feed (alias)
female
fighter-jet
file-archive-o
file-audio-o
file-code-o
file-excel-o
file-image-o
file-movie-o (alias)
file-pdf-o
file-photo-o (alias)
file-picture-o (alias)
file-powerpoint-o
file-sound-o (alias)
file-video-o
file-word-o
file-zip-o (alias)
film
filter
fire
fire-extinguisher
flag
flag-checkered
flag-o
flash (alias)
flask
folder
folder-o
folder-open
folder-open-o
frown-o
futbol-o
gamepad
gavel
gear (alias)
gears (alias)
gift
glass
globe
graduation-cap
group (alias)
hand-grab-o (alias)
hand-lizard-o
hand-paper-o
hand-peace-o
hand-pointer-o
hand-rock-o
hand-scissors-o
hand-spock-o
hand-stop-o (alias)
handshake-o
hard-of-hearing (alias)
hashtag
hdd-o
headphones
heart
heart-o
heartbeat
history
home
hotel (alias)
hourglass
hourglass-1 (alias)
hourglass-2 (alias)
hourglass-3 (alias)
hourglass-end
hourglass-half
hourglass-o
hourglass-start
i-cursor
id-badge
id-card
id-card-o
image (alias)
inbox
industry
info
info-circle
institution (alias)
key
keyboard-o
language
laptop
leaf
legal (alias)
lemon-o
level-down
level-up
life-bouy (alias)
life-buoy (alias)
life-ring
life-saver (alias)
lightbulb-o
line-chart
location-arrow
lock
low-vision
magic
magnet
mail-forward (alias)
mail-reply (alias)
mail-reply-all (alias)
male
map
map-marker
map-o
map-pin
map-signs
meh-o
microchip
microphone
microphone-slash
minus
minus-circle
minus-square
minus-square-o
mobile
mobile-phone (alias)
money
moon-o
mortar-board (alias)
motorcycle
mouse-pointer
music
navicon (alias)
newspaper-o
object-group
object-ungroup
paint-brush
paper-plane
paper-plane-o
paw
pencil
pencil-square
pencil-square-o
percent
phone
phone-square
photo (alias)
picture-o
pie-chart
plane
plug
plus
plus-circle
plus-square
plus-square-o
podcast
power-off
print
puzzle-piece
qrcode
question
question-circle
question-circle-o
quote-left
quote-right
random
recycle
refresh
registered
remove (alias)
reorder (alias)
reply
reply-all
retweet
road
rocket
rss
rss-square
s15 (alias)
search
search-minus
search-plus
send (alias)
send-o (alias)
server
share
share-alt
share-alt-square
share-square
share-square-o
shield
ship
shopping-bag
shopping-basket
shopping-cart
shower
sign-in
sign-language
sign-out
signal
signing (alias)
sitemap
sliders
smile-o
snowflake-o
soccer-ball-o (alias)
sort
sort-alpha-asc
sort-alpha-desc
sort-amount-asc
sort-amount-desc
sort-asc
sort-desc
sort-down (alias)
sort-numeric-asc
sort-numeric-desc
sort-up (alias)
space-shuttle
spinner
spoon
square
square-o
star
star-half
star-half-empty (alias)
star-half-full (alias)
star-half-o
star-o
sticky-note
sticky-note-o
street-view
suitcase
sun-o
support (alias)
tablet
tachometer
tag
tags
tasks
taxi
television
terminal
thermometer (alias)
thermometer-0 (alias)
thermometer-1 (alias)
thermometer-2 (alias)
thermometer-3 (alias)
thermometer-4 (alias)
thermometer-empty
thermometer-full
thermometer-half
thermometer-quarter
thermometer-three-quarters
thumb-tack
thumbs-down
thumbs-o-down
thumbs-o-up
thumbs-up
ticket
times
times-circle
times-circle-o
times-rectangle (alias)
times-rectangle-o (alias)
tint
toggle-down (alias)
toggle-left (alias)
toggle-off
toggle-on
toggle-right (alias)
toggle-up (alias)
trademark
trash
trash-o
tree
trophy
truck
tty
tv (alias)
umbrella
universal-access
university
unlock
unlock-alt
unsorted (alias)
upload
user
user-circle
user-circle-o
user-o
user-plus
user-secret
user-times
users
vcard (alias)
vcard-o (alias)
video-camera
volume-control-phone
volume-down
volume-off
volume-up
warning (alias)
wheelchair
wheelchair-alt
wifi
window-close
window-close-o
window-maximize
window-minimize
window-restore
wrench
american-sign-language-interpreting
asl-interpreting (alias)
assistive-listening-systems
audio-description
blind
braille
cc
deaf
deafness (alias)
hard-of-hearing (alias)
low-vision
question-circle-o
sign-language
signing (alias)
tty
universal-access
volume-control-phone
wheelchair
wheelchair-alt
hand-grab-o (alias)
hand-lizard-o
hand-o-down
hand-o-left
hand-o-right
hand-o-up
hand-paper-o
hand-peace-o
hand-pointer-o
hand-rock-o
hand-scissors-o
hand-spock-o
hand-stop-o (alias)
thumbs-down
thumbs-o-down
thumbs-o-up
thumbs-up
ambulance
automobile (alias)
bicycle
bus
cab (alias)
car
fighter-jet
motorcycle
plane
rocket
ship
space-shuttle
subway
taxi
train
truck
wheelchair
wheelchair-alt
genderless
intersex (alias)
mars
mars-double
mars-stroke
mars-stroke-h
mars-stroke-v
mercury
neuter
transgender
transgender-alt
venus
venus-double
venus-mars
file
file-archive-o
file-audio-o
file-code-o
file-excel-o
file-image-o
file-movie-o (alias)
file-o
file-pdf-o
file-photo-o (alias)
file-picture-o (alias)
file-powerpoint-o
file-sound-o (alias)
file-text
file-text-o
file-video-o
file-word-o
file-zip-o (alias)
circle-o-notch
cog
gear (alias)
refresh
spinner
check-square
check-square-o
circle
circle-o
dot-circle-o
minus-square
minus-square-o
plus-square
plus-square-o
square
square-o
cc-amex
cc-diners-club
cc-discover
cc-jcb
cc-mastercard
cc-paypal
cc-stripe
cc-visa
credit-card
credit-card-alt
google-wallet
paypal
area-chart
bar-chart
bar-chart-o (alias)
line-chart
pie-chart
bitcoin (alias)
btc
cny (alias)
dollar (alias)
eur
euro (alias)
gbp
gg
gg-circle
ils
inr
jpy
krw
money
rmb (alias)
rouble (alias)
rub
ruble (alias)
rupee (alias)
shekel (alias)
sheqel (alias)
try
turkish-lira (alias)
usd
viacoin
won (alias)
yen (alias)
align-center
align-justify
align-left
align-right
bold
chain (alias)
chain-broken
clipboard
columns
copy (alias)
cut (alias)
dedent (alias)
eraser
file
file-o
file-text
file-text-o
files-o
floppy-o
font
header
indent
italic
link
list
list-alt
list-ol
list-ul
outdent
paperclip
paragraph
paste (alias)
repeat
rotate-left (alias)
rotate-right (alias)
save (alias)
scissors
strikethrough
subscript
superscript
table
text-height
text-width
th
th-large
th-list
underline
undo
unlink (alias)
angle-double-down
angle-double-left
angle-double-right
angle-double-up
angle-down
angle-left
angle-right
angle-up
arrow-circle-down
arrow-circle-left
arrow-circle-o-down
arrow-circle-o-left
arrow-circle-o-right
arrow-circle-o-up
arrow-circle-right
arrow-circle-up
arrow-down
arrow-left
arrow-right
arrow-up
arrows
arrows-alt
arrows-h
arrows-v
caret-down
caret-left
caret-right
caret-square-o-down
caret-square-o-left
caret-square-o-right
caret-square-o-up
caret-up
chevron-circle-down
chevron-circle-left
chevron-circle-right
chevron-circle-up
chevron-down
chevron-left
chevron-right
chevron-up
exchange
hand-o-down
hand-o-left
hand-o-right
hand-o-up
long-arrow-down
long-arrow-left
long-arrow-right
long-arrow-up
toggle-down (alias)
toggle-left (alias)
toggle-right (alias)
toggle-up (alias)
arrows-alt
backward
compress
eject
expand
fast-backward
fast-forward
forward
pause
pause-circle
pause-circle-o
play
play-circle
play-circle-o
random
step-backward
step-forward
stop
stop-circle
stop-circle-o
youtube-play
500px
adn
amazon
android
angellist
apple
bandcamp
behance
behance-square
bitbucket
bitbucket-square
bitcoin (alias)
black-tie
bluetooth
bluetooth-b
btc
buysellads
cc-amex
cc-diners-club
cc-discover
cc-jcb
cc-mastercard
cc-paypal
cc-stripe
cc-visa
chrome
codepen
codiepie
connectdevelop
contao
css3
dashcube
delicious
deviantart
digg
dribbble
dropbox
drupal
edge
eercast
empire
envira
etsy
expeditedssl
fa (alias)
facebook
facebook-f (alias)
facebook-official
facebook-square
firefox
first-order
flickr
font-awesome
fonticons
fort-awesome
forumbee
foursquare
free-code-camp
ge (alias)
get-pocket
gg
gg-circle
git
git-square
github
github-alt
github-square
gitlab
gittip (alias)
glide
glide-g
google
google-plus
google-plus-circle (alias)
google-plus-official
google-plus-square
google-wallet
gratipay
grav
hacker-news
houzz
html5
imdb
instagram
internet-explorer
ioxhost
joomla
jsfiddle
lastfm
lastfm-square
leanpub
linkedin
linkedin-square
linode
linux
maxcdn
meanpath
medium
meetup
mixcloud
modx
odnoklassniki
odnoklassniki-square
opencart
openid
opera
optin-monster
pagelines
paypal
pied-piper
pied-piper-alt
pied-piper-pp
pinterest
pinterest-p
pinterest-square
product-hunt
qq
quora
ra (alias)
ravelry
rebel
reddit
reddit-alien
reddit-square
renren
resistance (alias)
safari
scribd
sellsy
share-alt
share-alt-square
shirtsinbulk
simplybuilt
skyatlas
skype
slack
slideshare
snapchat
snapchat-ghost
snapchat-square
soundcloud
spotify
stack-exchange
stack-overflow
steam
steam-square
stumbleupon
stumbleupon-circle
superpowers
telegram
tencent-weibo
themeisle
trello
tripadvisor
tumblr
tumblr-square
twitch
twitter
twitter-square
usb
viacoin
viadeo
viadeo-square
vimeo
vimeo-square
vine
vk
wechat (alias)
weibo
weixin
whatsapp
wikipedia-w
windows
wordpress
wpbeginner
wpexplorer
wpforms
xing
xing-square
y-combinator
y-combinator-square (alias)
yahoo
yc (alias)
yc-square (alias)
yelp
yoast
youtube
youtube-play
youtube-square

After five alphas over the last nine months, Bootstrap Icons has officially gone stable with our v1.0.0 release! We're now over 1,100 icons and are on track to add hundreds more in our upcoming minor releases. This has been a labor of love and I'm thrilled to ship this latest update.

Since our fifth alpha two months ago, over a third of our icons have been redrawn as we fine-tuned paths and shapes. Much of the redrawing and improvements here came as preparation for an icon font, but regrettably that's been pushed back to a v1.1.0 release as the tooling for generating fonts from SVGs has proven more difficult to get right. 1,100+ icons

Our first alpha had just over 200 icons, and here we are with 1,120 icons in our first stable release. And we'll only have more in future releases.

Current Version: v1.0.0

The SVG icons reside in /skin/reboot/images/icons/bootstrap/

The SVG icons reside in /skin/reboot/images/icons/feather/

Bootstrap Palette

primary
secondary
success
danger
warning
info
light
dark

Extended Palette

blue | indigo | purple | pink | red | orange | yellow | green | teal | cyan | gray | gray-dark

.bg-x | .border-x | .text-x

blue
blue-100
blue-200
blue-300
blue-400
blue-500
blue-600
blue-700
blue-800
blue-900
indigo
indigo-100
indigo-200
indigo-300
indigo-400
indigo-500
indigo-600
indigo-700
indigo-800
indigo-900
purple
purple-100
purple-200
purple-300
purple-400
purple-500
purple-600
purple-700
purple-800
purple-900
pink
pink-100
pink-200
pink-300
pink-400
pink-500
pink-600
pink-700
pink-800
pink-900
red
red-100
red-200
red-300
red-400
red-500
red-600
red-700
red-800
red-900
orange
orange-100
orange-200
orange-300
orange-400
orange-500
orange-600
orange-700
orange-800
orange-900
yellow
yellow-100
yellow-200
yellow-300
yellow-400
yellow-500
yellow-600
yellow-700
yellow-800
yellow-900
green
green-100
green-200
green-300
green-400
green-500
green-600
green-700
green-800
green-900
teal
teal-100
teal-200
teal-300
teal-400
teal-500
teal-600
teal-700
teal-800
teal-900
cyan
cyan-100
cyan-200
cyan-300
cyan-400
cyan-500
cyan-600
cyan-700
cyan-800
cyan-900
gray
gray-100
gray-200
gray-300
gray-400
gray-500
gray-600
gray-700
gray-800
gray-900
gray-dark
gray-dark-100
gray-dark-200
gray-dark-300
gray-dark-400
gray-dark-500
gray-dark-600
gray-dark-700
gray-dark-800
gray-dark-900