HTML Lens

Download / Install How to install an extension

CRX id

gmgjjjhfmcdgnfgcledhfeghjkgfdpfp

Description from extension meta

HTML 구조, 스타일, 접근성을 시각화하는 브라우저 확장 프로그램

Image from store HTML Lens

Description from store HTML Lens는 웹 퍼블리셔와 프론트엔드 개발자를 위한 브라우저 확장 프로그램입니다. 이 확장 프로그램은 웹 페이지의 HTML 요소를 시각적으로 탐색하고, 각 요소의 마진, 패딩, 콘텐츠 영역을 오버레이로 표시해줍니다. 또한, aria- 속성, role, tabindex 등 접근성과 관련된 속성들을 분석하고 표시하여, 웹 접근성 진단에 도움을 줍니다. 사용자는 원하는 요소를 마우스로 선택하여 해당 요소의 구조와 접근성 관련 정보, 클래스, ID, 스타일 정보를 직관적으로 확인할 수 있습니다. 🔍 주요 기능: 마우스 오버로 요소의 박스 모델(마진/패딩/콘텐츠) 시각화 aria-, role, tabindex 등 접근성 속성 탐색 선택된 요소에 대한 포커스, 관계 엘리먼트 추적 기능 (업데이트 예정) UI : 다크/라이트 모드 전환 드래그 가능한 인터페이스 및 투명도 조절 👤 누가 사용하면 좋을까요? 웹 접근성을 고려해야 하는 퍼블리셔, 디자이너, 개발자 HTML/CSS 구조를 빠르게 분석하고 싶은 사람 실제 페이지 구조와 사용자 경험(UI/UX)의 일관성을 테스트하려는 QA 담당자 💡 이 확장 프로그램은 기존의 DevTools와는 다른 관점에서, 실무 퍼블리셔가 원하는 핵심 정보만을 빠르게 확인할 수 있도록 설계되었습니다.

Statistics

Installs

5

Links

Extension in store

Developer e-mail