Back
Syntax
Study
Editor
Mode:
HTML
CSS
JavaScript
PHP
Reset
Run »
HTML / CSS / JS
/* CSS-only progress bar */ .progress { position: relative; height: 8px; background: #e9ecef; border-radius: 4px; overflow: hidden; } .progress::before { content: ""; position: absolute; height: 100%; width: var(--progress, 0%); /* Controlled via JS: el.style.setProperty("--progress", "65%") */ background: #007bff; border-radius: 4px; transition: width 0.3s ease; }
Result
Open