Progress
Fortschritt als Balken oder Ring. Base UI liefert die Semantik (role="progressbar", aria-valuenow); die Füllung nutzt den Akzent-Verlauf. Im unbestimmten Zustand fehlt aria-valuenow bewusst.
Balken
Der Balken nutzt den waagerechten Akzent-Verlauf. Base UI setzt role=progressbar sowie aria-valuemin, aria-valuemax und aria-valuenow.
Upload
Import
Fertig
Eigener Maximalwert
max skaliert die Füllung, ohne die Semantik zu verändern: aria-valuenow bleibt der tatsächliche Wert.
Schritte (3 von 8)
Schritte (6 von 8)
Ring
Die Ring-Variante zeichnet denselben Wert als SVG-Kreis mit Token-Verlauf; die Beschriftung steht darunter.
Speicher 25 %
Speicher 65 %
Speicher 90 %
Unbestimmt
indeterminate lässt aria-valuenow weg und zeigt einen wandernden Balken. Bei reduzierter Bewegung steht er still.
Verbindung wird hergestellt …
Wird geladen …