→ Anonymous
→ Toggle switches

Toggle switches

This bootstrap css example is contributed by Anonymous, on 28-Apr-2024. Component is made with bootstrap css v.5.3. It is responsive. similar terms for this example is Switch

Tags: Toggle

Author Anonymous

852

v.5.3

Fork Fullscreen

<div>
    <div class="form-check form-switch">
        <input class="form-check-input" type="checkbox" role="switch" id="flexSwitchCheckDefault">
        <label class="form-check-label" for="flexSwitchCheckDefault">Default switch checkbox input</label>
    </div>
    <div class="form-check form-switch">
        <input class="form-check-input" type="checkbox" role="switch" id="flexSwitchCheckChecked" checked>
        <label class="form-check-label" for="flexSwitchCheckChecked">Checked switch checkbox input</label>
    </div>
    <div class="form-check form-switch">
        <input class="form-check-input" type="checkbox" role="switch" id="flexSwitchCheckDisabled" disabled>
        <label class="form-check-label" for="flexSwitchCheckDisabled">Disabled switch checkbox input</label>
    </div>
    <div class="form-check form-switch">
        <input class="form-check-input" type="checkbox" role="switch" id="flexSwitchCheckCheckedDisabled" checked disabled>
        <label class="form-check-label" for="flexSwitchCheckCheckedDisabled">Disabled checked switch checkbox input</label>
    </div>
</div>

More Examples

Collapsible Sidebarteste

Author:
Bruno Dezan

1 week ago

201

v.5.3
Custom buttons

Author:
Anonymous

1 year ago

679

v.5.3
HTML and CSS for Hero Section
Explanation: HTML: Hero Section: Uses a background image with a gradient overlay. Hero Content: Centered with a title, subtitle, and a call-to-action button. CSS: Hero Section Styling: Full viewport height with a gradient overlay for better text readability and a background image. Hero Content Styling: Centered with responsive padding and font sizes. Button Styling: Custom button colors and hover effects. Background Image: Placeholder URL: Replace 'https://via.placeholder.com/1920x1080' with the actual URL of your hero image

Author:
zobaidul kaziex

7 months ago

940

v.4.6
Parallax effect with image background

Author:
Anonymous

4 months ago

853

v.4.6
Responsive Products Grid

Author:
Ross Wille

9 months ago

1.4k

v.5.3
Simple hero
Hero section with a linear gradient

Author:
Moana silva

9 months ago

648

v.4.6
Responsive Admin Dashboard Component

Author:
Isaac Winslow

5 months ago

862

v.5.3
Coming Soon Page
Coming Soon landing page example made with Bootstrap 5

Author:
Maria Garcia

9 months ago

528

v.5.3
Feature showcase cards

Author:
Mateo Rojas

4 months ago

384

v.5.3
Marquee Animation
On hover stop effect

Author:
Anonymous

9 months ago

5.7k

v.5.3
Feature Cards
showcases three key features with a clean, minimal design.

Author:
Alaric Sloane

5 months ago

771

v.5.3
Collapsible Sidebarteste

Author:
Bruno Dezan

1 week ago

194

v.5.3

Didn't find component you were looking for?

Search from 300+ componenent