Detector de fuente

La detección de fuentes es un inspector visual rápido para colores, espaciado y contraste. Funciona en cualquier sitio, se abre en un panel compacto y recuerda un tamaño seguro. Puedes cerrar el lector de fuentes de la extensión haciendo clic en la cruz en la ventana o haciendo clic en el ícono.

🔥 Aspectos Destacados

⭐ Copias de CSS limpias: Todo, buscador de fuentes, tipografía, colores.
⭐️ Inspección en vivo en la página con pasar el mouse y hacer clic en cualquier elemento.
⭐️ Insignias Web/Local de la aplicación de detector de fuente de Chrome renderizadas.
⭐️ Elementos guardados para referencias tipográficas y componentes.

📌 Cómo Funciona

Pasa el mouse o haz clic para bloquear un elemento; el panel muestra el selector, Copiar CSS. El modo mejorado en el buscador de fuentes te dice si el acceso está bloqueado. Necesitas descargar cada vez que inicias la extensión, pero no necesitas darle permiso al navegador nuevamente en el detector de fuente del mismo sitio web.

⚡️ Acciones Clave

1. Pasa el mouse para previsualizar.
2. Haz clic para bloquear la selección.
3. Copia CSS limpio.
4. Cambia el detector de fuente.
5. Guarda cualquier elemento.
6. Alterna tipografía.

🪐 Visualización y Ventana

Muestra u oculta secciones de tipografía, color y espaciado para mantener la interfaz mínima. La ventana de la extensión de detector de fuente de Chrome se ajusta a tu pantalla, comienza en la pestaña de elementos y no se abrirá minimizada.

📚 Copias Preestablecidas

- Todos los datos de CSS para un bloque de estilo completo.
- Tipografía para conjuntos de texto listos para el diseño.
- Colores para paletas con extensiones de fuentes.

🧩 Detalles de Tipografía

Familia y pila, peso con nombres legibles, tamaño, altura de línea, espaciado de letras/palabras, estilo, variante, además de botones de copia rápida de peso. La extensión de buscador de fuentes de Chrome está agrupada para que veas lo esencial sin desorden.

🎯 Beneficios Adicionales

1️⃣ Carga rápida de información local basada en el dominio en un dominio permitido.
2️⃣ Selector de tamaño de fuente de la extensión de Chrome fuera de pantalla con redimensionamiento seguro.
3️⃣ Se previene estrictamente la duplicación de elementos guardados para mantener la limpieza.

💡 Quién se Beneficia

Los desarrolladores front-end pueden encontrar fuentes en el sitio web, considerando a los desarrolladores que verifican los datos renderizados y el espaciado; diseñadores UI/UX auditando tipografía, colores y contraste; equipos de QA/accesibilidad revisando rápidamente los niveles WCAG. También es un buscador para equipos que comparten datos para sistemas de diseño consistentes.

🚀 Ventajas Rápidas

➤ Datos de CSS limpios.
➤ Inspección rápida.
➤ Un extractor de fuentes.
➤ Listo para el contraste.
➤ Referencia web guardada.
➤ Panel compacto.

🧶 Modo de Pausa

Detén temporalmente la selección para que puedas interactuar libremente con la página y la herramienta de detector de fuente web no funcionará. Tócala cuando necesites desplazarte, hacer clic o activar estados de la interfaz sin perder tu lugar; luego reanuda la inspección en un solo paso y podrás identificar la fuente en el sitio web.

🧷 Contenidos del Elemento Recibido

• URL de la página web.
• Sello de nombre de host.
• Un selector de estilo de fuente.
• Tamaño y peso.
• Estilo + altura de línea.

🌟 Guardar Comentarios

Cuando haces algo en el detector de fuente para el sitio web, el panel muestra señales visuales claras: una notificación de marca de verificación actualiza el contador guardado, las acciones de copia activan un breve mensaje de copia en el ícono, y los estados de acceso denegado del detector de fuente muestran una advertencia para que sepas exactamente qué corregir antes de continuar.

🧠 Preguntas Frecuentes

Q: ¿Necesito tener DevTools abierto?
A: No, todo está en el panel flotante.

Q: ¿Afectará la velocidad de mi página?
A: La extensión de detector de fuente de Chrome está bien optimizada.

Q: ¿Funciona en todas partes?
A: Sí. El modo mejorado necesita HTTPS para descargar datos locales.

🔎 Pausa vs Activo

Cuando el inspector está activo, el buscador de fuentes del sitio web captura tu cursor para resaltar elementos, por lo que los clics y los pases del mouse en la página son interceptados. Activa la pausa y la extensión "se aparta": puedes hacer clic en botones e interactuar con la página normalmente. ¿Listo para usar el selector de familia de fuentes nuevamente? Desactiva la pausa y sigue adelante.

🧰 Controles de Ventana

◆ Arrastra para reposicionar el panel.
◆ Redimensiona los bordes para ajustar tu vista.
◆ Un detector de fuente recuerda el tamaño.
◆ Se ajusta a tu pantalla actual.
◆ Maximiza para una vista grande segura.

📝 Comparación con Otras Herramientas

A diferencia de la what font extension, que principalmente informa el nombre de la familia declarada, nuestra herramienta revela la fuente renderizada real, ofrece copias de CSS limpias con un solo clic y guarda instantáneas completas de elementos. A diferencia de la whatfont extension, también puedes cargar presentaciones locales para mayor precisión y mantener una lista.

☘️ Cómo Empezar

1️⃣ Comienza usando la descarga del detector de fuente del sitio web, haz clic en el ícono, pasa el mouse o haz clic en un elemento.
2️⃣ Explora la información en la ventana ocultando secciones con datos que no necesitas ahora.
3️⃣ Establece el modo de pausa cuando necesites cambiar algo sin bloquear la extensión.

❤️ Palabras Finales

Realmente intentamos hacer una gran extensión de selector y siempre estamos abiertos a tus comentarios para futuras mejoras. Instala y disfruta de un uso cómodo.