Components Overview

Shock ships with a library of 40+ components — polished, ready-made blocks you assemble pages from. Every one is built on Bootstrap 5 and wired into Shock’s color system, so it picks up your palette automatically.

Learn by example

Each component has a live demo in the Shock preview pages included with your download. The fastest way to build is to open a demo, copy the HTML block, and paste it into your page — then edit the text and colors. These pages describe each component and tell you where to find its live example.

Browse by category

Buttons

Super, filled and outlined buttons with animations, shapes and duocolor variants.

Buttons →

Cards

Six card styles — shadow, outline, double-edge and image cards.

Cards →

Pricing Tables

Shadow, outline and double-edge pricing tables.

Pricing →

Forms

Basic, compact and floating-label contact forms, plus every input type.

Forms →

Banners

Basic and extended banners for hero sections and calls to action.

Banners →

Sliders & Carousels

Basic and extended sliders plus a logo/content carousel.

Sliders →

Text Effects

Typed text, scrolling text, circular text, animated underlines, super headings and more.

Text Effects →

Counters & Progress

Number counters plus line and circular progress bars.

Counters →

Interactive & Overlays

Accordions, tabs, tooltips, modals, popups and the preloader.

Interactive →

Media

Media galleries, image mirror effects and styled maps.

Media →

Tables & Dividers

Functional tables and decorative zigzag dividers.

Tables & Dividers →

Prefer to browse the real thing first? Open the preview pages included in your download and click through each demo before you start building.