Run
1264 x 150
x
1
<!DOCTYPE html>
2
<html>
3
<head>
4
<style>
5
input[type=checkbox] {
6
accent-color: blue;
7
}
8
9
input[type=radio] {
10
accent-color: red;
11
}
12
13
input[type=range] {
14
accent-color: rgb(20, 20, 500);
15
}
16
17
progress {
18
accent-color: hsl(100, 100%, 50%);
19
}
20
21
</style>
22
</head>
23
<body>
24
25
<h1>accent-color property example</h1>
26
27
<h3>Accent color for checkboxes:</h3>
28
<input type="checkbox" id="vehicle1" name="vehicle1" value="programmer" checked>
29
<label for="vehicle1"> iam programmer</label><br>
30
<input type="checkbox" id="vehicle2" name="vehicle2" value="marketer" checked>
31
<label for="vehicle2"> Iam digital marketer</label><br><br>
32
33
<h3>Accent color for radiobuttons:</h3>
34
<input type="radio" id="programming" name="fav_language" value="PROGRAMMING">
35
<label for="programming">PROGRAMMING</label><br>
36
<input type="radio" id="seo" name="fav_language" value="SEO" checked>
37
<label for="seo">SEO</label><br>
38
39
<h3>Accent color for a range field:</h3>
40
<label for="vol">uploading:</label>
41
<input type="range" id="uploading" name="uploading" min="30" max="100">
42
43
<h3>Accent color for a progress element:</h3>
44
<label for="file">uploading progress:</label>
45
<progress id="file" value="90" max="100"> 72% </progress>
46
47
</body>
48
</html>