ProFontFinder 작동 원리

ProFontFinder는 서버 업로드 없는 아키텍처를 기반으로 합니다. 이미지 디코딩, 에지 필터링, 글자 추출, 특징 비교 등 모든 과정이 HTML5 Canvas와 WebAssembly를 통해 사용자의 브라우저 내에서 직접 수행됩니다.

이미지나 캡처 화면을 화면에 끌어다 놓으면:

• 브라우저 RAM 내 오프스크린 HTML5 Canvas 컨텍스트로 이미지가 디코딩됩니다.
• 네트워크 요청이 발생하지 않으며, 어떠한 이미지 데이터도 기기 외부로 나가지 않습니다.
• 적응형 오츠(Otsu) 이진화 알고리즘이 배경 및 노이즈로부터 글자 형태를 분리합니다.
• 명암비와 해상도를 정규화하여 글자 획의 두께를 표준화합니다.

이진화 마스크가 완성되면:

• 연결 요소 라벨링 기법을 통해 개별 글자의 경계 상자(Bounding Box)를 추출합니다.
• 윤곽선 추적 알고리즘이 바깥쪽 외곽선과 글자 내부의 빈 공간(Counter)을 계산합니다.
• 기하학적 비율 측정을 통해 x-높이, 대문자 높이, 어센더, 디센더 수치를 추출합니다.
• 말단 각도와 개구부의 열린 정도를 측정하여 세리프, 산세리프, 디스플레이 서체군으로 분류합니다.

추출된 벡터 시그니처를 사전에 컴파일된 서체 카탈로그와 대조합니다:

• 벡터 특징들을 정규화된 경량 디지털 지문 데이터로 변환합니다.
• 유클리드 거리 척도를 이용해 검증된 Google Fonts와 광학 윤곽선을 비교합니다.
• 서체 카테고리 필터(Sans, Serif, Mono, Display, Script)로 탐색 범위를 좁힙니다.
• 기하학적 유사도와 구조적 일치성을 반영하여 신뢰도 점수(0~100%)를 산출합니다.

가장 일치하는 폰트 결과를 즉시 복사 가능한 코드로 정리합니다:

• 공식 Google Fonts CDN @import 규칙 및 <link> 스타일시트 태그 생성.
• 안전한 시스템 폰트가 폴백으로 포함된 정확한 CSS font-family 선언.
• 지원되는 굵기(Weight) 목록 및 가변 폰트 축 상세 정보 제공.
• 라이선스를 직접 검토할 수 있는 Google Fonts 공식 상세 페이지 링크 제공.