Análisis de diseño web,
¿qué herramienta usar?
PixelKit ofrece 8 herramientas: inspección CSS, extracción de colores, tipografía, medición de espaciado (px) y verificación de contraste WCAG 2.1 (AA 4.5:1 / AAA 7:1).
4 herramientas gratis + 9 Pro para completar el flujo de diseño web de diseñadores y desarrolladores.
¿Se puede probar PixelKit sin instalarlo?
Sí — experimenta las funciones principales de PixelKit aquí mismo, sin necesidad de instalar la extensión.
¿Qué funciones tiene PixelKit?
4 gratuitas + 5 exclusivas Pro, 8 herramientas principales en total
Inspector Hoverify
GratisPase el cursor sobre cualquier elemento para ver en tiempo real Box Model, 6 propiedades de Typography (font-family, size, weight, line-height, letter-spacing, color), Layout, Background y accesibilidad.
Extracción de paleta de colores
ProRecopila automáticamente todos los colores de la página web y los clasifica por categorías mediante algoritmo de clustering.
Inspector de fuentes
ProConsulta al instante 6 propiedades de elementos de texto: font-family, size, weight, line-height, letter-spacing y color.
Verificación de contraste WCAG
ProCalcula en tiempo real la relación de contraste usando la fórmula WCAG 2.1. Determina el nivel AA (4.5:1) y AAA (7:1).
Medición de espaciado
ProMuestra la distancia horizontal, vertical y diagonal entre dos elementos en píxeles (px) con líneas punteadas rojas estilo Figma.
Copiar CSS
ProCopia el CSS computado de un elemento al portapapeles con un solo clic. Selección de rango disponible.
Superposición de cuadrícula
GratisSuperpone un CSS Grid de 12 columnas para verificar visualmente la alineación del diseño.
Style Strip
ProElimina progresivamente el CSS en 4 niveles para analizar la estructura HTML.
¿Cuánto cuesta PixelKit?
Comienza gratis ($0), Pro cuesta $1/mes o $20 de por vida. Las 4 herramientas básicas son gratis para siempre.
Free
- ✓Inspector Hoverify
- ✓Color Picker (historial de 5)
- ✓Superposición Grid
- ✓Screenshot (solo visible)
Pro Monthly
- ✓Incluye todas las funciones Free
- ✓Palette Extractor
- ✓Font Inspector
- ✓Spacing Measure
- ✓WCAG Contrast Checker
- ✓CSS Copy / Style Strip
- ✓Visual Editor / Layout Editor
- ✓Quick Theme / Presets
- ✓Todas las herramientas API
Pro Lifetime
- ✓Incluye todas las funciones Pro
- ✓Actualizaciones de por vida
- ✓Soporte prioritario
Preguntas frecuentes
¿Qué es PixelKit?+
PixelKit es una extensión de Chrome para analizar y editar el diseño visual de páginas web. Ofrece 8 herramientas incluyendo inspección CSS, extracción de colores, análisis de tipografía, medición de espaciado y verificación de contraste WCAG.
¿Cómo se instala PixelKit?+
Busca 'PixelKit' en Chrome Web Store o haz clic en el botón de instalación de la página de inicio. Está listo para usar inmediatamente después de la instalación.
¿Es PixelKit gratuito?+
Sí, las 4 herramientas principales (Inspector Hoverify, Color Picker, Grid Overlay, Screenshot) son gratuitas para siempre. El plan Pro cuesta $1/mes o $20 de por vida.
¿Qué funciones adicionales incluye el plan Pro?+
El plan Pro añade 9 herramientas: Palette Extractor, Font Inspector, Spacing Measure, WCAG Contrast Checker, CSS Copy, Style Strip, Visual/Layout Editor, Quick Theme y Presets.
¿Cómo funciona la verificación de contraste WCAG?+
Calcula en tiempo real la relación de contraste entre el color del texto y el fondo basándose en la fórmula WCAG 2.1. Determina automáticamente el nivel AA (4.5:1 o superior) y AAA (7:1 o superior).
¿Se puede usar PixelKit en navegadores distintos a Chrome?+
Sí, PixelKit se puede instalar y usar en navegadores basados en Chromium como Edge, Brave y Arc a través de Chrome Web Store.
¿Cómo se instala PixelKit?
Busca 'PixelKit' en Chrome Web Store o haz clic en el botón de abajo para ir directamente a la página de instalación.
Comienza gratis y actualiza a Pro cuando lo necesites.