Sprache

Design und Assets

Progress Bar CSS Generator

Erzeuge CSS progress bar components.

Eingabe

Progress Bar CSS Generator

progress barcssuidashboard
Ausgabe

Progress Bar CSS Generator

.progress-shell {
  width: min(100%, 360px);
  border-radius: 999px;
  background: color-mix(in srgb, #0f172a 14%, white);
  padding: 6px;
}

.progress-bar {
  height: 10px;
  width: 68%;
  border-radius: 999px;
  background: linear-gradient(90deg, #22c55e, color-mix(in srgb, #22c55e 65%, white));
  box-shadow: 0 8px 18px color-mix(in srgb, #22c55e 30%, transparent);
}
Live preview
Live canvas

Ähnliche Tools

Cookie preferences

We use cookies for essential site features and, with your permission, analytics and advertising.