SvelteKit · Threlte · Static SSG

Exact vector brand icon animation

The loader animates the real brand elements of icon.svg — not a drawn outline. The green G sweep enters first, the orange base/inner form rises next, and the exact green arrow element travels bottom-to-top before everything settles onto the cleaned vector.

01 G sweeps in 02 Base rises 03 Arrow rises 04 Settle pop

Current animation

Keep this one as-is: green sweep, orange base rise, then arrow rise.

variant="current"

Bottom flow animation

Orange grows from right-to-left, green grows bottom-to-top, then arrow grows bottom-to-top.

variant="flow"

Orbit build

Green and orange swing around the center, then the arrow locks into place.

variant="orbit"

Pulse pop

The full mark breathes with a soft loading pulse and arrow accent.

variant="pulse"

Top write animation

Same reveal method as option 2: green grows from the top down, orange grows left-to-right, then the arrow draws left-to-right like writing.

variant="write"

Stepped green swing

Stepped sequence: orange swings in first, then green (both using option 3’s swing), then the arrow rises in like the first animation.

variant="swing"

Crescent glow

Same stepped sequence as option 6, then the real inner orange crescent simply appears last with a warm glow after the arrow lands.

variant="flash"