Übergänge 1.2.0

Eigenschaft-scoped transition utilities backed by motion duration tokens — stable CSS in 1.2.0. English: Transitions

Reifegrad: In VelinStyle 1.2.0 als stable dokumentiert. Studio und die vollständige Utility Engine bleiben geplant — ausgelieferte Utilities sind unter @layer utilities von Hand geschrieben, kein vollständiger Variantengenerator.

Wann verwenden

Wende Transition-Utilities an, die mit --velin-duration-*- und Ease-Tokens verdrahtet sind.

Wann nicht

Dekorative Bewegung muss prefers-reduced-motion respektieren.

Klassen

Klasse	Eigenschaft
`.velin-transition`	all (Token)
`.velin-transition-colors`	color, background-color, border-color
`.velin-transition-opacity`	opacity
`.velin-transition-transform`	transform
`.velin-transition-shadow`	box-shadow
`.velin-transition-none`	none

<button type="button" class="velin-btn velin-btn--primary velin-transition-colors">Hover mich</button>
<button type="button" class="velin-btn velin-btn--ghost velin-transition-opacity">Opacity</button>

Reduzierte Bewegung

Der globale Reset verkürzt Transitions unter prefers-reduced-motion: reduce. Bevorzuge .velin-transition-none wenn ein Control niemals animieren darf.

Verwandt: Animationsüberblick, Motion-Runtime.