→ 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

1.9k

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

404 page template
with an animated illustration and a button to redirect to the homepage

Author:
Anonymous

3 months ago

965

v.5.3
Bootstrap 5 Login Modal

Author:
Anonymous

1 year ago

11.5k

v.5.3
Bootstrap user profile
User profile card made with bootstrap

Author:
Anonymous

8 months ago

5.8k

v.5.3
Features section

Author:
Juan Martinez

1 year ago

1.2k

v.5.3
Error Page, you can use HTML, CSS, and Bootstrap.
HTML: Error Title: A large, bold number (e.g., 404) to indicate the error type. Error Message: A brief message explaining the error. Button: A button to navigate back to the home page. Adjust the href attribute to point to your actual home page URL. CSS: Background Gradient: Applied to the body to give a stylish look. Error Container: Centered on the page with a semi-transparent background for contrast. Button Styling: Custom colors for the button, including hover effects.

Author:
zobaidul kaziex

1 year ago

1.6k

v.4.6
Background image with bootstrap 4
Bootstrap 4 background image

Author:
Anonymous

9 months ago

1.2k

v.4.6
Pricing Cards
Three pricing tiers (Basic, Pro, and Enterprise) using Bootstrap's card component.

Author:
Sofia Petrova

1 year ago

1.8k

v.5.3
Simple Pricing Card Component

Author:
Anonymous

10 months ago

1.3k

v.5.3
Social media buttons
Beautiful and simple social media buttons

Author:
Maria Garcia

1 year ago

3.4k

v.5.3
Coming Soon Landing Page

Author:
Anonymous

11 months ago

2.4k

v.5.3
Footer
Footer de Bootstrap con enlaces rápidos, contacto y redes sociales, usando íconos para mejor navegación. Diseño limpio y responsivo. 🚀

Author:
Anonymous

6 months ago

2.3k

v.4.6
About Our Company
Display your company data

Author:
Tane Mahuta

1 year ago

1.9k

v.5.3

Didn't find component you were looking for?

Search from 300+ componenent