GitHub Trending웹 · 프론트엔드오늘의 주요

Nutlope/hallmark

AI 냄새 제거하는 웹 디자인 도구 Hallmark 공개

원제 Nutlope/hallmark

스타 41,261당일 +2,110CSS
Key Point

AI 코딩 어시스턴트 사용 시 발생하는 '대량 생산된 듯한' 디자인을 자동으로 차단하고, 실제 기능하는 웹 인터페이스를 빠르게 만들 수 있는 오픈 도구가 나왔다는 점이 개발자에게 의미가 있다.

핵심 요약

  • Claude Code, Codex, Cursor 등 AI 코딩 도구용 디자인 스킬 Hallmark를 Together AI가 공개했다.
  • 48개의 테마를 제공하며, 각 테마는 종이·글씨·색상·표면 같은 구체적 물리적 속성을 담은 자료(material)이다.
  • AI가 생성한 듯한 디자인의 흔한 문제점들(모든 제목 위의 눈썹 모양, 추적된 대문자 레이블, 제목 속 한 단어만 칠하기, 빈 프레임)을 명시적으로 검출하고 차단한다.
  • 페이지 용도에 맞춰 핵심 액션(예약·구매·뉴스레터 구독)을 페이지 끝에 배치하고, 실제 숫자와 오픈라이선스 사진 755장을 사용한다.
  • `/hallmark redesign` 명령으로 기존 페이지의 콘텐츠와 기능은 유지하며 디자인만 교체할 수 있고, `/hallmark audit`은 검사만 수행한다.
  • 빌드 프로세스는 프로젝트 정보 수집 → 3개 후보 테마 제시 → 히어로 섹션 단독 렌더링·검토 → 8개 너비에서 페이지 검사로 진행된다.
  • 최종 결과는 자체 HTML·CSS 파일이며, 첫 CSS 주석에 적용된 디자인 결정을 기록한다.
  • 설치는 npm으로 전역(-g) 또는 프로젝트 단위로 가능하며, 스크린샷·브라우저 검사를 위해 Puppeteer와 Chrome이 필요하다.
  • Wikimedia Commons의 오픈라이선스 사진만 사용하며 Unsplash·Pexels·Pixabay 같은 AI 도구 사용을 금지하는 스톡 서비스는 제외한다.
  • MIT 라이선스로 공개되어 누구나 포크하고 배포할 수 있다.
AI 요약 안내

AI가 한국어로 정리한 내용입니다. 정확한 정보는 원문을 확인해 주세요.

요약 원칙 ↗