DevSuite Pro

Más de 64 potentes herramientas para desarrolladores en una extensión — inspecciona, mide, captura, analiza y diseña

DevSuite Pro: El kit definitivo todo en uno para desarrolladores, kit de desarrollo web y suite de diseño (64 herramientas en 1 extensión de Chrome) Deja de instalar docenas de extensiones de un solo propósito. DevSuite Pro integra 64 herramientas profesionales para desarrolladores, utilidades de diseño web y analizadores SEO en una extensión rápida y respetuosa con la privacidad — la verdadera suite todo en uno para todos los que crean, diseñan, prueban o auditan sitios web modernos. Inspecciona y cambia CSS en vivo, edita HTML en cualquier página, captura pantallas de página completa, descarga todas las imágenes y SVG, audita SEO, ejecuta comprobaciones WCAG y de contraste, formatea JSON / XML / SQL, decodifica tokens JWT, genera contraseñas y UUIDs, simula vista móvil y tableta, convierte páginas a PDF, monitorea red y WebSocket, fuerza modo oscuro, edita cookies y mucho más. 💾 AUTOGUARDADO: EDICIONES PERSISTENTES POR SITIO Seis herramientas guardan tus cambios por URL y los reaplican en cada visita — incluso tras reabrir el navegador: • Inspector CSS — las ediciones CSS persisten en las recargas • Mover elemento — los elementos reposicionados se quedan en su lugar • Eliminar/Ocultar elemento — anuncios, popups y banners ocultos permanecen ocultos para siempre • Reemplazador de imágenes — las imágenes intercambiadas siguen reemplazadas • Cambiador de fuentes — la tipografía elegida se reaplica automáticamente • Editor de texto en vivo — el texto editado persiste entre sesiones ═══ 🎨 INSPECCIONAR, EDITAR Y REPLICAR ═══ 1) Inspector CSS [GRATIS] — Pasa el cursor sobre cualquier elemento, cambia CSS en vivo, ve valores computados, modelo de caja, padding, margin y variables CSS. Las ediciones se autoguardan por sitio. 2) Inspector de animaciones [DE PAGO] — Detecta cada animación CSS, transición y @keyframes. Ralentiza, pausa, repite y desplaza cuadro a cuadro. 3) Copiar como Tailwind [DE PAGO] — Clic derecho convierte CSS en clases utilitarias Tailwind. Convierte estilos de cualquier web a TailwindCSS. 4) Modo solo contorno [GRATIS] — Aplica contorno de 1 píxel a cada elemento. Visualiza el wireframe, depura HTML/CSS y encuentra límites ocultos de div. 5) Asistente Tailwind [DE PAGO] — El cursor muestra clases Tailwind con variantes de breakpoint y modo oscuro. Hoja de trucos integrada. 6) Esquema de página [GRATIS] — Renderiza el árbol HTML como esquema interactivo. Visualiza la jerarquía DOM. 7) Detector de componentes [DE PAGO] — Detecta componentes frontend frameworks, CMS, e-commerce, CDN, hosting, analytics y SvelteKit. Identifica el framework de cualquier web. 8) Mover elemento [DE PAGO] — Arrastra elementos visualmente. Reposiciona encabezados, sidebars y secciones hero. Persistencia por sitio. 9) Eliminar / Ocultar elemento [GRATIS] — Clic elimina el elemento. Bloquea anuncios, descarta cookie banners, suprime popups. Permanece oculto para siempre. 10) Exportar elemento [DE PAGO] — Exporta el HTML, CSS computado y JSON de cualquier elemento. 11) Copiar código de componente [DE PAGO] — Convierte cualquier elemento en código React JSX, Vue SFC o Svelte. 12) Buscador de ruta DOM [DE PAGO] — Obtén selector CSS, XPath y querySelector para automatización con Selenium, Puppeteer. ═══ 📸 CAPTURA Y RECURSOS ═══ 13) Captura de pantalla [GRATIS] — Captura viewport visible, página completa o un solo elemento. Smart scroll para páginas largas y contenido lazy-loaded. Sin marcas de agua. 14) Extraer imágenes [GRATIS] — Descarga todas las imágenes con un clic. Filtra por tamaño y formato (PNG, JPG, GIF, WebP, SVG), descarga masiva como ZIP. 15) Capturador de SVG [DE PAGO] — Encuentra cada icono SVG y vector inline. Previsualiza, copia código SVG, optimiza o descarga como SVG/PNG. 16) Reemplazador de imágenes [DE PAGO] — Reemplaza imágenes con archivo local o URL. Persistencia por sitio — perfecto para mockups de cliente. 17) Convertir a PDF [GRATIS] — Guarda webs como PDF limpio con auto-ocultación de anuncios y tamaño personalizado. ═══ 📐 DISEÑO Y MEDICIÓN ═══ 18) Generador de código QR [GRATIS] — Convierte la URL actual en QR escaneable. Personaliza contenido (URL, texto, Wi-Fi, vCard) y descarga como PNG. 19) Regla de página [GRATIS] — Dibuja reglas y guías con precisión de píxeles. Mide píxeles con guías horizontales, verticales y diagonales. 20) Visor responsivo [DE PAGO] — Mira tu sitio renderizado en múltiples tamaños — common mobile, tablet, and desktop sizes y viewports personalizados. Sincroniza scroll. 21) Medir distancia [GRATIS] — Clic en dos elementos y ve la distancia X, Y y diagonal en píxeles. 22) Inspector Z-Index [DE PAGO] — Visualiza cada contexto de apilamiento y capa z-index. Diagnostica modales ocultos y errores de stacking. 23) Visualizador Grid / Flex [DE PAGO] — Inspecciona contenedores CSS Grid y Flexbox con superposiciones coloridas. ═══ 🔍 ANÁLISIS Y DEPURACIÓN ═══ 24) Simulador de mapa de calor [DE PAGO] — Mapa de calor predicho basado en patrón F y jerarquía visual. Análisis UX sin scripts de terceros. 25) Borrar datos de navegación [GRATIS] — Limpia caché, cookies, localStorage y sessionStorage solo del sitio actual — sin afectar otros logins. 26) Stack del sitio (detector tech) [DE PAGO] — Identifica tecnologías: frontend frameworks, CMS, e-commerce, CDN, hosting, analytics y más. 27) Inspector SEO [GRATIS] — Auditoría SEO en página: título, meta descripción, H1–H6, OpenGraph, Twitter Card, canónica, robots, alt text, análisis de enlaces. 28) Inspector de accesibilidad [DE PAGO] — Auditoría automatizada WCAG 2.1 Nivel AA. Detecta contraste, alt text faltante, ARIA para cumplimiento ADA, EAA y Section 508. 29) Monitor de red [DE PAGO] — Captura cada solicitud fetch, XHR y AJAX con headers, payload, respuesta y tiempo. 30) Inspector WebSocket [DE PAGO] — Captura cada frame WebSocket en tiempo real. Depura Socket.io, apps de chat y dashboards en vivo. 31) Verificador de enlaces rotos [DE PAGO] — Escanea hipervínculos rotos (404, 500, DNS, timeouts) y reporta códigos HTTP. 32) Imágenes rotas [GRATIS] — Escanea imágenes que no cargan (404, src faltante, DNS, CORS). 33) Verificador CORS [GRATIS] — Prueba solicitudes cross-origin e inspecciona headers CORS. Diagnostica errores "blocked by CORS policy". ═══ 🅰️ DISEÑO Y TIPOGRAFÍA ═══ 34) Editor de texto en vivo [GRATIS] — Clic en cualquier texto para editarlo. Titulares, párrafos, botones. Persistencia por sitio. 35) Cambiador de fuentes [DE PAGO] — Reemplaza fuentes con más de 1.500 Google Fonts — global o por elemento. Persistencia por sitio. 36) Listar todas las fuentes [GRATIS] — Descubre cada fuente usada — web fonts, system fonts, pesos y estilos. Copia CSS font-family con un clic. 37) Selector de color [GRATIS] — Cuentagotas con precisión de píxel. Toma colores de texto, fondos, imágenes, gradientes y SVG. HEX, RGB, HSL. 38) Paleta de colores [GRATIS] — Extrae la paleta completa con muestras ordenadas por frecuencia y HEX. 39) Convertidor de formato de color [GRATIS] — Traduce cualquier color a todos los formatos CSS desde un solo panel (p. ej., pega #FF5733 y míralo en vivo como rgb(255, 87, 51), hsl(11, 100%, 60%), hsv(11, 80%, 100%) y oklch(64% 0.21 32), con variantes alfa para la transparencia). 40) Extractor de color de imagen [GRATIS] — Extrae la paleta dominante de cualquier imagen. ═══ ⚡ INTERRUPTORES Y UTILIDADES ═══ 41) Forzar modo oscuro [GRATIS] — Aplica tema oscuro a cualquier sitio. Inversión inteligente que preserva imágenes y colores de marca. 42) Activar/desactivar JavaScript [GRATIS] — Activa o desactiva JavaScript por pestaña. Verifica salida SSR y vista de crawlers. 43) Editor de cookies [GRATIS] — Gestión completa: ver, crear, editar, eliminar, importar y exportar cookies. Depura flujos de autenticación. 44) Visor de consola [GRATIS] — Visor inline para console.log, warn y error. Sin DevTools — ideal para móvil. 45) Editor de almacenamiento local [GRATIS] — Visualiza y edita localStorage y sessionStorage. Depura feature flags y A/B tests. 46) Rendimiento de página [GRATIS] — Métricas de tiempo, recursos, DOM y health score sin auditoría Lighthouse completa. ═══ ⚙️ FORMATEADORES Y GENERADORES ═══ 47) Formateador JSON [GRATIS] — Embellece, minimiza, valida JSON en árbol colapsable con detección de errores. 48) Codificador/Decodificador Base64 [GRATIS] — Codifica texto a Base64 o decodifica. UTF-8 y binario. 49) Codificador/Decodificador URL [GRATIS] — Codifica caracteres especiales en URL-safe strings o decodifica. 50) Codificador de entidades HTML [GRATIS] — Convierte caracteres HTML (&, <, >, ", ') a entities o decodifica. 51) Escape de barra invertida [GRATIS] — Escapa secuencias (\\n, \\t, \\", \\\\). Para JSON, regex y codegen. 52) Imagen ↔ Base64 [GRATIS] — Convierte imagen (PNG, JPG, GIF, SVG, WebP) en data URL Base64 o viceversa. 53) Depurador JWT [GRATIS] — Decodifica JSON Web Tokens. Visualiza header, payload, firma. Verifica expiración y claims. 54) Generador de UUID [GRATIS] — Genera UUIDs v4 (RFC 4122) individualmente o en masa. Criptográficamente aleatorios. 55) Generador de hash [GRATIS] — Genera hashes MD5, SHA-1, SHA-256, SHA-384 y SHA-512. 56) Generador de contraseñas [GRATIS] — Contraseñas aleatorias seguras con longitud y conjuntos personalizados. 57) Probador de regex [GRATIS] — Prueba expresiones regulares con resaltado en vivo y soporte completo de flags (g, i, m, s, u, y). 58) Convertidor de marca de tiempo [GRATIS] — Convierte entre Unix timestamps, ISO 8601, RFC 2822 y fechas legibles. 59) Herramienta diff [GRATIS] — Compara dos bloques de texto línea por línea con codificación de color. 60) Verificador de contraste (WCAG) [GRATIS] — Verifica ratios de contraste WCAG con AA y AAA pass/fail. 61) CSV ↔ JSON [GRATIS] — Convierte entre CSV y JSON. Detecta cabeceras, soporta delimitadores personalizados. 62) Formateador XML [GRATIS] — Embellece, minimiza y valida XML. Formatea SOAP, RSS, sitemaps. 63) Formateador SQL [GRATIS] — Embellece queries SQL (common database dialects). 64) Rellenador de formularios [DE PAGO] — Auto-rellena formularios con datos de prueba realistas — nombres, emails, direcciones, tarjetas de prueba, Lorem Ipsum. ═══ 🚀 GRATIS vs DE PAGO ═══ ✅ GRATIS PARA SIEMPRE — 43 herramientas esenciales (Selector de color, Captura de pantalla, Formateador JSON, Inspector SEO, Editor de cookies, Regla de página, Convertir a PDF y más). ⭐ DE PAGO — 21 herramientas avanzadas (Asistente Tailwind, Visor responsivo, Copiador de código de componente, Monitor de red, Simulador de mapa de calor, Rellenador de formularios y más). ═══ 🔒 PRIVACIDAD PRIMERO ═══ DevSuite Pro se ejecuta de forma segura en tu Chrome. Sin telemetría, sin analítica, sin SDKs de seguimiento. Tu código, capturas, JSON, regex, API tokens y cookies nunca salen de tu máquina. La validación de licencia solo envía tu clave. 🚀 ¡Potencia tu flujo de desarrollo web! Instala DevSuite Pro — el único kit que necesitarás. Si DevSuite Pro te ahorra tiempo, apóyanos con una reseña de 5 estrellas.