Guía
Medidas, colores y código con el modo desarrollador
En la pestaña Dev del portal mides cualquier elemento, ves su tipografía, sus colores y su caja, y copias su CSS y su HTML.
Quién puede
- Para
- Quien programa, Tu cliente
- Rol
- Tu cliente, sin cuenta
- Dónde
- En el portal del cliente
Quien programa la interfaz encuentra en el portal todo lo que necesita de cada pantalla, sin pedir capturas ni medidas.
Abrir el modo desarrollador
En el visor, pulsa Dev en la barra de abajo, o la pestaña Dev del panel de la derecha. Se queda activo al pasar de una pantalla a otra.
Medir y ver un elemento
- Pasa el cursor por la pantalla para medir lo que tienes debajo.
- Haz clic en un elemento para elegirlo.
- Con uno elegido, pasa por otro para ver la distancia entre los dos. Con Alt, la distancia al borde.
Del elemento elegido ves su tamaño y su selector, su texto, su Tipografía (fuente, tamaño, peso, interlineado, espaciado y color) y su Caja (margen, relleno, esquinas, borde y fondo). Cada dato se copia con un clic.
Abajo, Copiar CSS y Copiar HTML, y las casillas para ver el código. Si es un icono SVG, Copiar el código del SVG.
Assets y colores
- Assets de la pantalla: las imágenes e iconos que usa, para verlos con fondo claro, oscuro o a cuadros, y descargarlos uno a uno.
- Colores de la pantalla: cada color, en HEX, RGB o HSL; un clic lo copia y, al pasar, se resalta dónde se usa.
Descargar
En la misma pestaña están las Descargas de la pantalla o de toda la entrega, si el estudio las activó: ver Descargar los archivos de la entrega.
Para el estudio
El modo desarrollador se activa por entrega en Qué ve el cliente › Herramientas › Modo desarrollador, y viene encendido en cada entrega nueva. Lo ve cualquiera que abra la entrega.
