Explore our collection of CSS Toggle Switches! Discover a curated selection of free HTML and CSS toggle switch code examples from trusted platforms like CodePen and GitHub. This update to our June 2021 collection includes forty-five new toggle switch items.
Enhance your website with stylish and interactive switches, perfect for improving user interface elements. Choose from a wide range of creative and customizable examples to suit your needs.
Related Articles
Links
Made with
- HTML / CSS
About a code
CSS Elastic Toggle
Compatible browsers: Chrome, Edge, Firefox, Opera, Safari
Responsive: yes
Dependencies: -
Links
Made with
- HTML / CSS
About a code
CSS Dark Blue Toggle
Compatible browsers: Chrome, Edge, Firefox, Opera, Safari
Responsive: yes
Dependencies: -
Links
Made with
- HTML (Pug) / CSS
About a code
Toggles - Void Portal
Compatible browsers: Chrome, Edge, Firefox, Opera, Safari
Responsive: no
Dependencies: -
Links
Made with
- HTML / CSS
About a code
CSS Eye Toggle
Compatible browsers: Chrome, Edge, Firefox, Opera, Safari
Responsive: yes
Dependencies: -
Links
Made with
- HTML / CSS
About a code
CSS Toothed Toggle
Compatible browsers: Chrome, Edge, Firefox, Opera, Safari
Responsive: no
Dependencies: -
Links
Made with
- HTML / CSS
About a code
Neu Toggle
Compatible browsers: Chrome, Edge, Firefox, Opera, Safari
Responsive: yes
Dependencies: -
Links
Made with
- HTML / CSS
About a code
CSS Modern Lighted Toggle
Compatible browsers: Chrome, Edge, Firefox, Opera, Safari
Responsive: yes
Dependencies: -
Links
Made with
- HTML (Pug) / CSS (SCSS)
About a code
Toggle
Compatible browsers: Chrome, Edge, Firefox, Opera, Safari
Responsive: yes
Dependencies: -
Links
Made with
- HTML / CSS (SCSS)
About a code
GUI Toggle
Compatible browsers: Chrome, Edge, Firefox, Opera, Safari
Responsive: no
Dependencies: -
Links
Made with
- HTML / CSS (SCSS)
About a code
Skeuomorphic Toggle Switch (Vol. 4)
Compatible browsers: Chrome, Edge, Firefox, Opera, Safari
Responsive: no
Dependencies: -
Links
Made with
- HTML / CSS
About a code
Rolling Theme Switch
Compatible browsers: Chrome, Edge, Firefox, Opera, Safari
Responsive: yes
Dependencies: -
Links
Made with
- HTML / CSS (SCSS)
About a code
Skeuomorphic Toggle Switch (Vol. 3)
Compatible browsers: Chrome, Edge, Firefox, Opera, Safari
Responsive: no
Dependencies: -
Links
Made with
- HTML / CSS (SCSS)
About a code
Bump - Agressive Toggle
Compatible browsers: Chrome, Edge, Firefox, Opera, Safari
Responsive: no
Dependencies: -
Links
Made with
- HTML / CSS (SCSS)
About a code
Colorful Toggle Switches
Compatible browsers: Chrome, Edge, Firefox, Opera, Safari
Responsive: no
Dependencies: -
Links
Made with
- HTML / CSS
About a code
Rocker Switches
Realistic-looking CSS rocker switches with an LED light shown in light and dark schemes.
Compatible browsers: Chrome, Edge, Firefox, Opera, Safari
Responsive: yes
Dependencies: -
Links
Made with
- HTML / CSS
About a code
Colorful Theme Switch
A theme toggle switch that utilizes :has() to turn everything dark rather than the tiniest bit of JavaScript.
Compatible browsers: Chrome, Edge, Firefox, Opera, Safari
Responsive: yes
Dependencies: -
Links
Made with
- HTML / CSS (SCSS)
About a code
Skeuomorphic Toggle Switch (Vol. 1)
Compatible browsers: Chrome, Edge, Firefox, Opera, Safari
Responsive: no
Dependencies: -
Links
Made with
- HTML / CSS (SCSS)
About a code
3D Glass Switch
Pure CSS neumorphic 3D glass switch with nnimation.
Compatible browsers: Chrome, Edge, Firefox, Opera, Safari
Responsive: yes
Dependencies: -
Links
Made with
- HTML / CSS
About a code
Stylish Checkbox
Compatible browsers: Chrome, Edge, Firefox, Opera, Safari
Responsive: no
Dependencies: fint-awesome.css
Links
Made with
- HTML / CSS (SCSS)
About a code
CSS Minimal Dark Mode Toggle Button
Compatible browsers: Chrome, Edge, Firefox, Opera, Safari
Responsive: no
Dependencies: -
Links
Made with
- HTML / CSS
About a code
CSS Custom Checkbox
Custom checkbox created with HTML and CSS.
Compatible browsers: Chrome, Edge, Firefox, Opera, Safari
Responsive: no
Dependencies: -
Links
Made with
- HTML / CSS
About a code
Coffee Toggle
Custom CSS checkbox styled as a coffee mug.
Compatible browsers: Chrome, Edge, Firefox, Opera, Safari
Responsive: no
Dependencies: -
Links
Made with
- HTML / CSS
About a code
CSS Blob Checkbox
Compatible browsers: Chrome, Edge, Firefox, Opera, Safari
Responsive: no
Dependencies: -
Links
Made with
- HTML / CSS
About a code
Light/Dark Toggle With Morphing Icon
A color scheme switch featuring an icon that morphs according to the theme and an inverting curtain.
Compatible browsers: Chrome, Edge, Firefox, Opera, Safari
Responsive: yes
Dependencies: -
Links
Made with
- HTML / CSS
About a code
CSS Only Checkbox
Compatible browsers: Chrome, Edge, Firefox, Opera, Safari
Responsive: no
Dependencies: -
Links
Made with
- HTML / CSS
About a code
Switch
Compatible browsers: Chrome, Edge, Firefox, Opera, Safari
Responsive: no
Dependencies: font-awesome.css
Links
Made with
- HTML / CSS
About a code
Giant Gear Toggle
Compatible browsers: Chrome, Edge, Firefox, Opera, Safari
Responsive: no
Dependencies: -
Links
Made with
- HTML (Pug) / CSS (SCSS)
About a code
Toggle
Compatible browsers: Chrome, Edge, Firefox, Opera, Safari
Responsive: no
Dependencies: -
Links
Made with
- HTML (Pug) / CSS (SCSS)
About a code
Pure CSS Switch
Compatible browsers: Chrome, Edge, Firefox, Opera, Safari
Responsive: no
Dependencies: -
Links
Made with
- HTML / CSS
About a code
Pure CSS 3D Orange Switch
Compatible browsers: Chrome, Edge, Firefox, Opera, Safari
Responsive: no
Dependencies: -
Links
Made with
- HTML / CSS (SCSS)
About a code
Pin Toggle Interaction
Compatible browsers: Chrome, Edge, Firefox, Opera, Safari
Responsive: yes
Dependencies: -
Links
Made with
- HTML / CSS (SCSS)
About a code
CSS Ball Switch
Compatible browsers: Chrome, Edge, Firefox, Opera, Safari
Responsive: no
Dependencies: -
Links
Made with
- HTML / CSS
About a code
Switch Toggle Checkbox Button
Compatible browsers: Chrome, Edge, Firefox, Opera, Safari
Responsive: yes
Dependencies: -
Links
Made with
- HTML / CSS
About a code
Toggle On/Off
Compatible browsers: Chrome, Edge, Firefox, Opera, Safari
Responsive: no
Dependencies: -
Links
Made with
- HTML / CSS
About a code
On/Off using ::first-letter
Compatible browsers: Chrome, Edge, Firefox, Opera, Safari
Responsive: no
Dependencies: -
Links
Made with
- HTML / CSS (SCSS)
About a code
On and Off Toggle 2 Rotations CSS
Compatible browsers: Chrome, Edge, Firefox, Opera, Safari
Responsive: no
Dependencies: -
Links
Made with
- HTML (Pug) / CSS (SCSS)
About a code
Pure CSS Realistic Red Switch
A realistic switch using CSS only. It uses multiple CSS techniques here, including gradients, 3D transformations, animations and transitions.
Compatible browsers: Chrome, Edge, Firefox, Opera, Safari
Responsive: no
Dependencies: -
Links
Made with
- HTML / CSS (SCSS)
About a code
Spinning Toggle
Compatible browsers: Chrome, Edge, Firefox, Opera, Safari
Responsive: no
Dependencies: -
Links
Made with
- HTML (Pug) / CSS (Stylus)
About a code
3D 2021 CSS Toggle
Compatible browsers: Chrome, Edge, Opera, Safari
Responsive: yes
Dependencies: -
Made with
- HTML / CSS
About a code
Creating Day-Night CSS Only Toggle Switch
Compatible browsers: Chrome, Edge, Firefox, Opera, Safari
Responsive: no
Dependencies: -
Links
Made with
- HTML / CSS
About a code
Toggle
Compatible browsers: Chrome, Edge, Firefox, Opera, Safari
Responsive: no
Dependencies: -
Links
Made with
- HTML / CSS
About a code
Toggle Bubble
A toggle button drawn as a bubble containing a donut that turns to resemble a 0 or 1.
Compatible browsers: Chrome, Edge, Firefox, Opera, Safari
Responsive: yes
Dependencies: -
Links
Made with
- HTML / CSS
About a code
Half Orange Button
Compatible browsers: Chrome, Edge, Firefox, Opera, Safari
Responsive: no
Dependencies: -
Links
Made with
- HTML / CSS
About a code
Toggle Button
CSS rules are kept repetitive so that you can get CSS rules for each button easily.
Compatible browsers: Chrome, Edge, Firefox, Opera, Safari
Responsive: no
Dependencies: -
Links
Made with
- HTML / CSS
About a code
Neumorphic-Toggle-Button
Compatible browsers: Chrome, Edge, Firefox, Opera, Safari
Responsive: no
Dependencies: font-awesome.css
Links
Made with
- HTML / CSS (Less)
About a code
Sea Mode
Compatible browsers: Chrome, Edge, Opera, Safari
Responsive: no
Dependencies: -
Links
Made with
- HTML / CSS (SCSS)
About a code
Animated CSS Switch Button
Compatible browsers: Chrome, Edge, Firefox, Opera, Safari
Responsive: no
Dependencies: -
Links
Made with
- HTML / CSS (SCSS)
About a code
CSS Neumorphism Toggle
Compatible browsers: Chrome, Edge, Firefox, Opera, Safari
Responsive: no
Dependencies: -
Links
Made with
- HTML / CSS (SCSS)
About a code
CSS Egg Switch
Compatible browsers: Chrome, Edge, Firefox, Opera, Safari
Responsive: no
Dependencies: -
Links
Made with
- HTML / CSS
About a code
Neumorphic Toggle
Compatible browsers: Chrome, Edge, Firefox, Opera, Safari
Responsive: no
Dependencies: -
Links
Made with
- HTML / CSS (Sass)
About a code
Pure CSS Fuel Gauge Toggle
E 1/2 F pure CSS fuel gauge toggle click on the gauge to toggle the indicator.
Compatible browsers: Chrome, Edge, Firefox, Opera, Safari
Responsive: no
Dependencies: -
Links
Made with
- HTML (Pug) / CSS (SCSS)
About a code
Toggles
Do you want your toggle fancy or functional?
Compatible browsers: Chrome, Edge, Firefox, Opera, Safari
Responsive: no
Dependencies: -
Links
Made with
- HTML / CSS (Sass)
About a code
Toggle
Toggle / checkbox without label.
Compatible browsers: Chrome, Edge, Firefox, Opera, Safari
Responsive: no
Dependencies: -
Links
Made with
- HTML / CSS (SCSS)
About a code
Power switch animation
Simple power switch animation.
Compatible browsers: Chrome, Edge, Firefox, Opera, Safari
Responsive: no
Dependencies: -
Links
Made with
- HTML / CSS (SCSS)
About a code
CSS Plane Switch
Compatible browsers: Chrome, Edge, Firefox, Opera, Safari
Responsive: no
Dependencies: -
Links
Made with
- HTML / CSS (SCSS)
About a code
CSS Heart Switch
Compatible browsers: Chrome, Edge, Firefox, Opera, Safari
Responsive: no
Dependencies: -
Links
Made with
- HTML / CSS (SCSS)
About a code
Toggle Switch Checkbox
Compatible browsers: Chrome, Edge, Firefox, Opera, Safari
Responsive: yes
Dependencies: -
Links
Made with
- HTML / CSS
About a code
Subscribe Toggle Button
A subscribe toggle button featuring "Smudge, The Confused Cat" From Famous "Woman Yelling At Cat" meme.
Compatible browsers: Chrome, Edge, Firefox, Opera, Safari
Responsive: no
Dependencies: -
Links
Made with
- HTML / CSS (SCSS)
About a code
Square to Circle Toggle
Compatible browsers: Chrome, Edge, Firefox, Opera, Safari
Responsive: no
Dependencies: -
Links
Made with
- HTML / CSS (SCSS)
About a code
Volume Toggle CSS Switch
Sound on/off transition.
Compatible browsers: Chrome, Edge, Firefox, Opera, Safari
Responsive: no
Dependencies: -
Links
Made with
- HTML / CSS (SCSS)
About a code
Simple CSS Switch / Toggle
Compatible browsers: Chrome, Edge, Firefox, Opera, Safari
Responsive: no
Dependencies: -
Links
Made with
- HTML / CSS
About a code
Simple CSS Switch / Toggle
Compatible browsers: Chrome, Edge, Firefox, Opera, Safari
Responsive: no
Dependencies: -
Links
Made with
- HTML / CSS (SCSS)
About a code
Antsy Toggles
Toggles that have a bit of anxiety...
Compatible browsers: Chrome, Edge, Firefox, Opera, Safari
Responsive: no
Dependencies: -
Links
Made with
- HTML / CSS
About a code
Checkbox CSS Toggle - Day / Night Mode
Compatible browsers: Chrome, Edge, Firefox, Opera, Safari
Responsive: no
Dependencies: -
Links
Made with
- HTML / CSS (SCSS)
About a code
Animated CSS Toggle Switch
Compatible browsers: Chrome, Edge, Firefox, Opera, Safari
Responsive: no
Dependencies: -
Links
Made with
- HTML / CSS
About a code
Toy Toggle Switch
What a toggle switch may look like if on a Little Tikes product, considering the plastic look. The handle is to resemble a dual colored ball.
Compatible browsers: Chrome, Edge, Firefox, Opera, Safari
Responsive: no
Dependencies: -
Links
Made with
- HTML (Pug) / CSS (SCSS)
About a code
Checkbox Animation with Pure CSS
Compatible browsers: Chrome, Edge, Firefox, Opera, Safari
Responsive: no
Dependencies: -
Links
Made with
- HTML / CSS (SCSS)
About a code
Day/Night Toggle
Compatible browsers: Chrome, Edge, Firefox, Opera, Safari
Responsive: no
Dependencies: -
Links
Made with
- HTML / CSS
About a code
A Confusing Toggle Button
A confusing toggle button / toggle switch Using HTML and CSS.
Compatible browsers: Chrome, Edge, Firefox, Opera, Safari
Responsive: no
Dependencies: -
Links
Made with
- HTML (Pug) / CSS (SCSS)
About a code
An Actual Pure CSS Checkbox Slider
Lots people use JS for the text changes but you don't need to.
Compatible browsers: Chrome, Edge, Firefox, Opera, Safari
Responsive: no
Dependencies: -
Links
Made with
- HTML / CSS (SCSS)
About the code
Checkbox Toggle Animation
Pure CSS checkbox toggle animation.
Compatible browsers: Chrome, Edge, Firefox, Opera, Safari
Responsive: yes
Dependencies: -
Links
Made with
- HTML / CSS
About the code
Toggle Radial Effect
Compatible browsers: Chrome, Edge, Firefox, Opera, Safari
Responsive: no
Dependencies: -
Links
Made with
- HTML / CSS
About a code
Pure CSS Dark Mode Toggle Switcher
Compatible browsers: Chrome, Edge, Firefox, Opera, Safari
Responsive: no
Dependencies: -
Links
Made with
- HTML / CSS (SCSS)
About the code
CSS Grid Toggle
A new take on the CSS toggle, using CSS grid animations.
Compatible browsers: Chrome, Edge, Firefox, Opera, Safari
Responsive: no
Dependencies: -
Links
Made with
- HTML (Pug) / CSS (SCSS)
About the code
Simple Knobby Toggles
HTML & CSS simple knobby toggles.
Compatible browsers: Chrome, Firefox (partial), Opera, Safari
Responsive: no
Dependencies: -
Links
Made with
- HTML / CSS
About the code
Gender Toggle Pure CSS
Compatible browsers: Chrome, Firefox, Opera, Safari
Responsive: yes
Dependencies: -
Links
Made with
- HTML / CSS
About the code
Checkbox Rocker Toggle Switch
An HTML checkbox form element styled as a rocker toggle switch.
Compatible browsers: Chrome, Edge, Firefox, Opera, Safari
Responsive: no
Dependencies: -
Links
Made with
- HTML / CSS (Stylus)
About the code
Pure CSS Bulb Switch
Pure HTML and CSS light bulb toggle switch.
Compatible browsers: Chrome, Edge, Firefox, Opera, Safari
Responsive: no
Dependencies: -
Links
Made with
- HTML / CSS (SCSS)
About the code
Switch Animation
Switch animation in HTML and CSS.
Compatible browsers: Chrome, Edge, Firefox, Opera, Safari
Responsive: no
Dependencies: -
Links
Made with
- HTML / CSS (SCSS)
About the code
Lock Switch Animation
Compatible browsers: Chrome, Edge, Firefox, Opera, Safari
Responsive: no
Dependencies: -
Links
Made with
- HTML / CSS
About the code
Toggle Buttons
More exciting than a boring checkbox.
Compatible browsers: Chrome, Firefox, Opera, Safari
Responsive: no
Dependencies: -
Links
Made with
- HTML / CSS
About the code
Pure CSS Toggle Buttons | ON-OFF Switches
Collection of toggle buttons / on-off switches which can be practically used in a website. Designed using CSS without any JavaScript.
Compatible browsers: Chrome, Edge, Firefox, Opera, Safari
Responsive: no
Dependencies: -
Links
Made with
- HTML / CSS (SCSS)
About the code
Switches (Checkboxes)
HTML and CSS toggle switches.
Compatible browsers: Chrome, Firefox, Opera, Safari
Responsive: no
Dependencies: -
Links
Made with
- HTML (Haml) / CSS (SCSS)
About the code
Wobble Toggle
Pure CSS wobble toggle switch.
Compatible browsers: Chrome, Edge, Firefox, Opera, Safari
Responsive: no
Dependencies: -
Links
Made with
- HTML / CSS
About a code
Toggle Buttons / On-Off Switches
Day night toggle button, elastic toggle button or on-off switches.
Compatible browsers: Chrome, Edge, Firefox, Opera, Safari
Responsive: no
Dependencies: -
Links
Made with
- HTML / CSS (SCSS)
About a code
3D Toggle
Just one checkbox input and its label.
Compatible browsers: Chrome, Edge, Firefox, Opera, Safari
Responsive: no
Dependencies: -
Links
Made with
- HTML (Haml) / CSS (SCSS)
About the code
Totoro Toggle
Very nice and simple Totoro toggle switch.
Compatible browsers: Chrome, IE, Edge, Firefox, Opera, Safari
Dependencies: -
Links
Made with
- HTML / CSS (Stylus)
About the code
Toggle
Pure CSS animated toggle switch.
Compatible browsers: Chrome, IE, Edge, Firefox, Opera, Safari
Dependencies: -
Links
Made with
- HTML / CSS
About the code
Cold-Hot Toggle Switch
Probably a toggle switch concept that no one has tried before. This one is for temperature—options being cold or hot. The idea is to portray the handle as an ice cube for cold and a flame for hot. For hot, the cube moves right and melts at the same time, and a rising flame moves along with it. For cold again, the water forms back into a cube while moving left, and the flame dies while moving with it.
Compatible browsers: Chrome, Firefox, Opera, Safari
Dependencies: -
Links
Made with
- HTML / CSS (SCSS)
About the code
CSS Bear Toggle
A beary cute toggle.
Compatible browsers: Chrome, IE, Edge, Firefox, Opera, Safari
Dependencies: Normalize.css
Links
Made with
- HTML / CSS (PostCSS)
About the code
Elastic Toggle
Pure CSS elastic toggle.
Compatible browsers: Chrome, IE, Edge, Firefox, Opera, Safari
Dependencies: Google Fonts
Links
Made with
- HTML / CSS (SCSS)
About the code
Sub/Sup Toggle
Sub and sup toggle switch.
Compatible browsers: Chrome, IE, Edge, Firefox, Opera, Safari
Dependencies: -
Links
Made with
- HTML / CSS
About a code
Light Bulb Toggle Switch
A custom checkbox that features a light bulb’s on/off state in the fashion of a toggle switch.
Compatible browsers: Chrome, Edge, Firefox, Opera, Safari
Responsive: yes
Dependencies: -
Links
Made with
- HTML / CSS (SCSS)
About the code
Toggle
Toggle switch pure CSS.
Compatible browsers: Chrome, IE, Edge, Firefox, Opera, Safari
Dependencies: -
Links
Made with
- HTML (Pug) / CSS (SCSS) / JavaScript
About the code
Realistic Toggle Button
HTML and CSS realistic toggle button with little JavaScript.
Compatible browsers: Chrome, Firefox, Opera, Safari
Dependencies: -
Links
Made with
- HTML (Pug) / CSS (SCSS) / JavaScript
About the code
Implementation of Liquid button
Transitioning between On and Off states.
Compatible browsers: Chrome, Firefox, Opera, Safari
Dependencies: -
Links
Made with
- HTML / CSS (SCSS)
About a code
All-CSS Toggle Switch
Compatible browsers: Chrome, Edge, Firefox, Opera, Safari
Responsive: no
Dependencies: -
Links
Made with
- HTML / CSS (Stylus)
About a code
Toggle Fix - Spotify Desktop App
Compatible browsers: Chrome, Edge, Firefox, Opera, Safari
Responsive: no
Dependencies: -
Links
Made with
- HTML / CSS (SCSS)
About a code
CSS Only Switch
Stylish switch design.
Compatible browsers: Chrome, Edge, Firefox, Opera, Safari
Responsive: no
Dependencies: -
Links
Made with
- HTML / CSS (SCSS)
About a code
Switch
Colourful animated switch.
Compatible browsers: Chrome, Edge, Firefox, Opera, Safari
Responsive: no
Dependencies: -
Links
Made with
- HTML / CSS
About the code
Another Toggle
Cool HTML and CSS toggle switch.
Compatible browsers: Chrome, IE, Edge, Firefox, Opera, Safari
Dependencies: Google Fonts
Links
Made with
- HTML / CSS (SCSS)
About a code
Pure CSS Minimal Toggle
Toggle with just CSS.
Compatible browsers: Chrome, Edge, Firefox, Opera, Safari
Responsive: no
Dependencies: -
Links
Made with
- HTML / CSS (SCSS)
About the code
Pure CSS Day And Night Toggle
Awesome HTML and CSS day and night toggle switch.
Compatible browsers: Chrome, IE, Edge, Firefox, Opera, Safari
Dependencies: Google Fonts
Links
Made with
- HTML / CSS (SCSS)
About the code
Simple Toggle
Simple toggle button.
Compatible browsers: Chrome, Edge, Firefox, Opera, Safari
Dependencies: -
Links
Made with
- HTML (Haml) / CSS
About the code
Flat Toggle Switch
Pure CSS flat toggle switch.
Compatible browsers: Chrome, IE, Edge, Firefox, Opera, Safari
Dependencies: -
Links
Made with
- HTML / CSS (SCSS)
About the code
Kitty Toggle
A simple checkbox toggle improved by being made into a cat.
Compatible browsers: Chrome, IE, Edge, Firefox, Opera, Safari
Dependencies: -
Links
Made with
- HTML / CSS (SCSS)
About the code
Pure CSS Toggles
Pure CSS toggles: flat look, 3D look.
Compatible browsers: Chrome, IE, Edge, Firefox, Opera, Safari
Dependencies: -
Links
Made with
- HTML (Pug) / CSS (SCSS)
About a code
Toggle Buttons
Pure CSS3 different toggle-button collection.
Compatible browsers: Chrome, Edge, Firefox, Opera, Safari
Responsive: no
Dependencies: -
Links
Made with
- HTML / CSS (SCSS)
About the code
Pure CSS Day/Night Toggle Swith
Dribbble rework of an original shot: https://dribbble.com/shots/1907553-Day-Night-Toggle-Button
Compatible browsers: Chrome, IE, Edge, Firefox, Opera, Safari
Dependencies: -
Links
Made with
- HTML / CSS
About the code
SVG Switches - Design
HTML/CSS switches design with SVG.
Compatible browsers: Chrome, Firefox, Opera, Safari
Dependencies: -
Links
Made with
- HTML (Haml) / CSS (SCSS) / JavaScript
About the code
Skew Switch
Nice skew switch.
Compatible browsers: Chrome (partial), IE (partial), Edge (partial), Firefox, Opera (partial), Safari (partial)
Dependencies: jQuery
Links
Made with
- HTML / CSS
About a code
Awesome Toggle Button
Two very nice radio buttons joined together as a toggle switch.
Compatible browsers: Chrome, Edge, Firefox, Opera, Safari
Responsive: no
Dependencies: -
Links
Made with
- HTML (Haml) / CSS (Sass)
About a code
Switch
Compatible browsers: Chrome, Edge, Firefox, Opera, Safari
Responsive: no
Dependencies: -
Links
Made with
- HTML / CSS / JavaScript
About the code
CSS Switch
Toggle switch with CSS animation.
Compatible browsers: Chrome, IE, Edge, Firefox, Opera, Safari
Dependencies: jQuery
Links
Made with
- HTML / CSS
About the code
iOS 7 Toggle
CSS/HTML only recreation of the iOS 7 toggle buttons.
Compatible browsers: Chrome, IE, Edge, Firefox, Opera, Safari
Dependencies: Modernizr.js
Links
Made with
- HTML / CSS (SCSS)
About the code
Switches
The first 2 are designed with depth and lighting, while the 3rd one is flatly designed with a somewhat "gooey"-ish transition on it.
Compatible browsers: Chrome, IE, Edge, Firefox, Opera, Safari
Dependencies: -