HTML document, ASCII text
1
<!DOCTYPE html>
2
<html>
3
<body>
5
<style>
6
input[type=checkbox].switch {
7
-webkit-appearance: none;
8
-moz-appearance: none;
9
appearance: none;
10
position: relative;
11
background: #000;
12
width: 30px;
13
height: 16px;
14
}
15
input[type=checkbox].switch::before {
16
top: 1px;
17
left: 1px;
18
position: absolute;
19
display: block;
20
background: red;
21
content: "";
22
color: transparent;
23
width: 14px;
24
height: 14px;
25
}
26
input[type=checkbox].switch:checked::before {
27
left: unset !important;
28
right: 1px;
29
}
30
</style>
31
<input type="checkbox" class="switch" />
32
</body>
33
</html>