Font Inspector — What Font & Copy CSS

Click text to see its font, weight, size, line-height, spacing and color, then copy as CSS. No network, no account.

버전: 3.0.3

빌드는 끝났지만 아직 스토어에 올라가지 않았습니다. 무엇을 하는 확장인지 미리 볼 수 있도록 페이지만 열어두었습니다.

이 페이지가 무슨 폰트를 쓰는지 궁금했거나, 어떤 텍스트의 정확한 CSS가 필요했던 적 있죠? Font Inspector를 켜고 아무 텍스트에나 마우스를 올리면 실제 계산된 타입 스택을 보여줘요. 실제로 렌더링되는 폰트, 굵기, 크기(px·rem), 행간, 자간, 스타일, 색상까지요. 클릭해서 고정한 뒤 통째로 CSS로 복사하면 끝이에요.

전부 브라우저 안에서 동작해요. 호스트 권한도, 네트워크 요청도, 계정도 없어요. 툴바 아이콘을 눌렀을 때만 그 페이지에 작동하고, 아무것도 탭 밖으로 나가지 않아요.

스크린샷

주요 기능

선언된 스택이 아니라 실제로 렌더링되는 폰트를 보여줘요.
굵기, 크기(px·rem), 비율까지 나오는 행간, 자간, 스타일.
스와치와 함께 hex·rgb로 정규화된 색상
최신 oklch·lab·color() 페이지에서도 동작해요.
깔끔한 CSS 블록 또는 font 축약형으로 복사, 선택은 기억돼요.
열린 shadow DOM까지 읽고, 클릭으로 고정, Esc나 ✕ 버튼으로 종료.
호스트 권한·네트워크·계정·추적 없음.

사용 방법

01아무 웹 페이지나 열어요.
02툴바의 Font Inspector 아이콘을 눌러요.
03텍스트에 마우스를 올려 타입 스택을 보고, 클릭해서 고정해요.
04블록 또는 축약형을 고르고 CSS 복사를 눌러요.
05Esc로 종료해요.

권한과 개인정보

단일 목적

Single purpose: Show the computed font/CSS of text on the current page and copy it as CSS. Permission — activeTab: run only on the tab where the user clicks the toolbar icon. Permission — scripting: inject the inspector script into that active tab on click. Permission — storage: remember the copy-format preference (block vs shorthand) locally. Host permissions: none. No <all_urls>, no declared hosts. Remote code: None. Data collection / transmission: None. Reads styles locally and copies to the clipboard only.

`activeTab`	확장 아이콘을 누른 뒤에만, 현재 보고 있는 탭을 읽을 수 있습니다.
`scripting`	화면을 바꾸기 위해 확장 자체 코드를 페이지에서 실행합니다.
`storage`	설정과 데이터를 브라우저 자체 저장소(이 기기)에 저장합니다.

아이콘을 누른 그 탭에서만 동작하고, 브라우저의 getComputedStyle로 스타일을 읽어 요청 시 클립보드에 복사할 뿐이에요. 아무것도 수집·원격 저장·전송하지 않아요. 어떤 폰트·디자인 서비스와도 무관한 독립 확장입니다. 확장에 포함된 코드만 실행하며 원격 코드를 내려받지 않습니다.

스크린샷

주요 기능

사용 방법

권한과 개인정보

관련 확장 프로그램