Source Code:
(back to article)
Submit
Result:
Report an issue
<!DOCTYPE html> <html> <head> <title>Title of the document</title> <style> meter { width: 400px; height: 30px; background: none; /* Required to get rid of the default background property */ background-color: lightgray; box-shadow: 0 5px 5px -5px #333 inset; } meter::-moz-meter-bar { box-shadow: 0 5px 5px -5px #999 inset; background-image: linear-gradient( 90deg, #2286c9 5%, #FF00FF 5%, #FF00FF 15%, #04C319 15%, #04C319 55%, #F1F70D 55%, #F1F70D 95%, #00FFCC 95%, #00FFCC 100%); background-size: 100% 100%; } </style> </head> <body> <meter value="30" min="0" max="70"></meter> </body> </html>