→ 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

949

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

Feature showcase
Feature showcase with icos

Author:
Anonymous

1 year ago

734

v.4.6
HTML, CSS, and Bootstrap. This approach will be purely HTML and CSS without any JavaScript.
HTML: Bootstrap Integration: Linked to Bootstrap CDN for styling. Form Structure: Contains input fields for name, email, and message, all within a card component. CSS: Background Gradient: Applied to the body for a visually appealing background. Card Styling: Rounded corners and padding for the card. Button Styling: Custom colors for the submit button, including hover effects. How to Use: Create an index.html file and copy the above code into it. Open the HTML file in your web browser to view the Contact Us form.

Author:
zobaidul kaziex

8 months ago

1.1k

v.4.6
About us section

Author:
Kemaya m

1 year ago

755

v.4.6
Simple comment form using Bootstrap 5

Author:
Anonymous

9 months ago

2.4k

v.5.3
Stats card made with boostrap 4.6
Minimal admin stats card

Author:
Mishti

10 months ago

1.5k

v.4.6
Testimonial carousel

Author:
Anonymous

5 months ago

517

v.5.3
Calender

Author:
Anonymous

9 months ago

664

v.4.6
Scroll Animation
Scroll Animation

Author:
Rami AlAjo

2 months ago

668

v.4.6
Interactive Team Member Card with Flip Effect

Author:
Reza Farhadi

8 months ago

1.6k

v.5.3
Activity Logs Dashboard
activity logs component with timeline visualization, export functionality, and detailed event tracking in Bootstrap 5.3.

Author:
Isaac Winslow

5 months ago

2.2k

v.5.3
Modern Bootstrap Search Bar

Author:
Anonymous

5 months ago

2.6k

v.5.3
About Section

Author:
Anonymous

6 months ago

683

v.5.3

Didn't find component you were looking for?

Search from 300+ componenent