morphicons

Roadmap

Where morphicons is heading. No dates: things ship when they feel right.

Shipped

  1. Core and morphicons.com

    Any icon morphs into any other: optimal rotation in closed form, spring physics, zero dependencies. The Studio scrubs every pair mid-flight.

  2. Five bindings

    react vue svelte react-native element, plus an Astro shell. One lifecycle contract, exact SSR, accessibility built in.

  3. Reduced motion as a policy

    reducedMotion: "never" | "user" | "always" on the driver and every binding.

  4. Format adapters

    svgToIcon reads SVG markup, maskTarget morphs CSS-mask icons, canvasTarget draws into any canvas. Each tree-shakes alone.

  5. Showcase

    Copy-paste components for the icon swaps real apps ship, in core, mask and canvas tabs.

  6. Filled icons in 2.0

    Material Symbols, Heroicons solid, Phosphor fill: stroked and filled icons morph into each other. The code loads on first use.

Up next

  1. Filled icons in the adapters

    maskTarget and canvasTarget draw strokes only today.

  2. Adapter ergonomics

    useTarget for React lifecycles and elementToIcon to read the icon an element already renders.

  3. Bulletproof inputs

    Clear errors at every public boundary: malformed paths, invalid springs.

Planned

  1. SVG Doctor

    Paste any SVG: a compatibility verdict, a live morph preview and ready-to-use code.

  2. Shareable Studio

    The pair, spring and progress, serialized in the URL.

Exploring

  1. Custom Animation Studio

    A timeline editor for choreographies beyond the automatic morph, as a separate package.

  2. Type that morphs

    Single-stroke fonts are pure centerlines: digits first, a counter whose 3 bends into 8.