Content
38 components- Accordion1 live demoThe Bootstrap 5 accordion is a collapsible content panel component that shows one (or multiple) panels at a time.
- Author Bio Box1 live demoAn Author Bio Box is a self-contained content block that displays a writer's photo, name, title, short biography, and optional social links,…
- Avatar Group3 live demosAn avatar group is a horizontal stack of circular user profile images that overlap one another, often with an overflow counter badge when the…
- Callout1 live demoA Callout is a styled block element used to draw attention to important information, warnings, tips, or notices within page content.
- Card3 live demosThe Bootstrap 5 card is a flexible content container with optional header, footer, body, and image sections.
- Card Group1 live demoA Bootstrap 5 Card Group renders multiple cards as a single connected unit with equal-height columns and flush borders between them, no gutters.
- Carousel1 live demoThe Bootstrap 5 carousel is a slideshow component for cycling through images, slides, or other content.
- Case Study Card1 live demoA Case Study Card is a Bootstrap 5 content component built on .card that summarises a client project in a compact, scannable block: a cover image…
- Client Logo1 live demoA Client Logo component is a horizontal or grid-based display of partner, client, or integration brand logos, typically used to build social proof…
- Comparison Table3 live demosA comparison table is a structured UI pattern that places two or more options side by side in a tabular layout so users can evaluate features at a…
- Counter1 live demoA Counter component in Bootstrap 5 displays animated numeric statistics that increment from zero to a target value when scrolled into view,…
- CTA Banner3 live demosA CTA (call-to-action) banner is a full-width or contained section that combines a headline, supporting copy, and one or more action buttons to…
- CTA Section1 live demoA CTA (call-to-action) section is a dedicated page section focused on driving a single conversion action: sign up, download, contact, or purchase.
- Display Heading1 live demoBootstrap 5 Display Headings are oversized heading styles, .display-1 through .display-6, designed for hero sections, landing pages, and anywhere…
- FAQ Accordion3 live demosA FAQ accordion is a vertically stacked list of questions where each answer panel expands and collapses on click, letting users scan questions…
- Feature Box1 live demoA Feature Box is a self-contained content block that pairs an icon or image with a heading and short descriptive text, used to highlight a product…
- Feature Section1 live demoA feature section showcases the key benefits or capabilities of a product or service.
- Figure1 live demoThe Bootstrap 5 Figure component provides semantic HTML structure for displaying images or illustrations alongside a caption using the <figure>…
- Icon Box1 live demoAn Icon Box is a content component that pairs an icon with a heading and short description, typically arranged in a card-like block.
- Image Lightbox2 live demosAn image lightbox is an overlay pattern that displays a full-size image above the page content when a thumbnail or trigger is activated.
- Image Thumbnail1 live demoBootstrap 5's Image Thumbnail component adds a rounded border and padding around an image using the .img-thumbnail class, giving it a framed,…
- Lead Text1 live demoBootstrap 5's Lead Text component uses the .lead class to make a paragraph visually larger and slightly lighter in weight than body copy, creating…
- List Group2 live demosThe Bootstrap 5 List Group is a flexible component for displaying a series of related content, from simple text lists to complex interactive panels.
- Logo Cloud3 live demosA logo cloud is a horizontal or grid-based row of partner, client, or sponsor brand marks used to build social proof or signal integrations.
- Logo Marquee1 live demoA Logo Marquee is a horizontally scrolling strip that displays a row of client, partner, or technology logos in a continuous loop.
- Pricing Table1 live demoA pricing table displays product or service tiers side-by-side, allowing visitors to compare plans and make a purchase decision.
- Pricing Toggle3 live demosA Pricing Toggle is a UI control that switches a pricing section between two billing periods, typically monthly and annual, revealing different…
- Profile Card3 live demosA profile card is a self-contained UI block that presents a person's avatar, name, role, and optional contact or social actions in a compact format.
- Rating Stars3 live demosA rating stars component displays a row of star icons that represent a score, typically on a scale of one to five.
- Related Posts1 live demoA Related Posts component in Bootstrap 5 displays a curated grid or list of additional articles, blog posts, or content items that are…
- Stat Counter1 live demoA Stat Counter is a Bootstrap 5 UI component that displays key metrics or numerical achievements in a visually prominent format: typically a large…
- Stats Band3 live demosA stats band is a full-width horizontal strip that presents a small set of key metrics or KPIs side by side, each consisting of a large numeral, a…
- Table2 live demosBootstrap 5 provides extensive table styling via opt-in classes applied to standard HTML table elements.
- Team Member Card1 live demoA Team Member Card is a Bootstrap 5 UI component that displays a person's photo, name, job title, and optionally a short bio or social media links…
- Testimonial Section1 live demoA testimonial section displays customer quotes, reviews, or case study highlights to build social proof and trust.
- Testimonial Slider3 live demosA testimonial slider is a rotating set of customer or user quotes displayed one at a time, typically showing an avatar, name, role, and review text.
- Timeline1 live demoA Timeline component in Bootstrap 5 is a vertically or horizontally arranged sequence of events, milestones, or steps displayed in chronological…
- Vertical Timeline3 live demosA vertical timeline is a custom UI pattern that renders a chronological list of events along a central or left-aligned vertical axis, with each…