← Todos los plugins

Mode Matrix

Todos los modos de una pantalla lado a lado, Light y Dark, marcas, densidades, cada copia revisada en contraste.

Qué hace

Mode Matrix lee las variables que un frame usa de verdad, sigue los alias hasta sus colecciones y arma una copia por modo: Light y Dark como filas, marcas como columnas y cualquier otra colección fija en el modo que elijas. Cada copia queda en sus modos con el cambio de modo propio de Figma, así que es exactamente lo que vería quien desarrolla.

Después revisa cada copia: el texto que baja de WCAG AA en ese modo, con los dos colores y el ratio, y las variables sin valor en algún modo. Haz clic en una celda para seleccionar las capas que fallan, vuelve a correrlo para actualizar el tablero en su lugar y copia el resultado en Markdown para el pull request.

  1. Elige filas y columnas

    Dos colecciones cualquiera: Light y Dark por marca, densidad o plataforma.

  2. Cada modo, revisado

    Contraste de texto en cada copia, y valores que faltan en un modo.

  3. Haz clic en una celda y ve por qué

    Los dos colores, el ratio y un clic para seleccionar la capa.

  4. Listo para el pull request

    Copia toda la matriz en Markdown.

Todo lo que hace

Arma

  • Una copia por modo, o una grilla de dos colecciones
  • Las demás colecciones fijas en el modo que elijas
  • Vuelve a correrlo y el tablero se actualiza en su lugar

Revisa

  • Contraste de texto en cada modo (WCAG 2.2 AA)
  • Cuenta la opacidad de la pintura y de la variable
  • Variables sin valor en algún modo

Entrega

  • Selecciona las capas que fallan desde cualquier celda
  • Los dos colores y el ratio de cada falla
  • Reporte en Markdown para el pull request

10 usos gratis, luego una licencia o Lab Pro. Ver precios →

Más plugins