mira-transition-dissolve

Transforms Mira deck navigation into a View Transitions API crossfade via a sidecar HTML file.

158|49|Updated Jun 10, 2026
One-click install
npx skills add https://github.com/sandeco/mira-animator --skill mira-transition-dissolve
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: mira-transition-dissolve
Source: https://github.com/sandeco/mira-animator/tree/main/agents/mira-transition-dissolve
Command: npx skills add https://github.com/sandeco/mira-animator --skill mira-transition-dissolve

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

Esta skill transforma a navegação entre slides do Mira em uma transição dissolve crossfade sem destruir o deck original, funcionando em contextos file:// offline e mantendo a integridade do conteúdo.

Core Features & Use Cases

  • Non-destructive: O deck original permanece intacto; gera um arquivo novo ao lado, com sufixo -dissolve (ex.: index.html → index-dissolve.html).
  • Crossfade: Usa a View Transitions API para renderizar uma dissolução entre slides sem tocar no arquivo original.
  • Offline e cross-browser: Compatível com Chrome/Edge em file://; fornece fallback para navegadores sem a API.
  • Idempotence e verificação: Pré-checagem de startViewTransition e marcadores para evitar duplicação.

Quick Start

Generate the index-dissolve.html alongside the original deck and load it to verify the dissolve transition.

Frequently Asked Questions about mira-transition-dissolve

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I add crossfade transitions to Mira slides for offline viewing?

Yes, dissolve transitions work in file:// mode using Chrome or Edge. The generated sidecar file includes a compatibility fallback for browsers without the View Transitions API, ensuring cross-browser support for offline deck navigation.

Can I apply View Transitions API crossfade effects without modifying my original HTML deck?

Yes, the crossfade effect is applied without modifying your original HTML deck. The process creates a new index-dissolve.html file next to the original, enforcing a non-destructive workflow unless you explicitly request modification of the source file.

Does the View Transitions API work with file:// mode for offline slide decks?

Yes, dissolve transitions work in file:// mode using Chrome or Edge. The generated sidecar file includes a compatibility fallback for browsers without the View Transitions API, ensuring cross-browser support for offline deck navigation.

How do I create Canva-like slide transitions using the View Transitions API?

To create Canva-like slide transitions, the tool transforms Mira deck navigation into a dissolve crossfade using the View Transitions API. It applies to decks navigating slide-by-slide via sections and generates an idempotent sidecar file for testing.

What happens if a browser does not support the View Transitions API for slide crossfades?

If a browser lacks View Transitions API support, a compatibility fallback is automatically applied. The workflow includes a pre-check for the startViewTransition method to ensure graceful degradation when rendering dissolve effects between slides.

Will generating dissolve transitions overwrite my original Mira presentation file?

No, generating dissolve transitions will not overwrite your original Mira presentation file. The idempotent workflow creates a separate sidecar file with a -dissolve suffix and enforces no modification of the original file unless explicitly requested.