Hallmark의 개요
Hallmark는 Hassan El Mghari(nutlope)가 만들고 Together AI 이름으로 공개한 Agent Skill로, 코딩 에이전트가 웹 페이지를 디자인하는 방식을 바꿉니다. 어떤 빌드도 어겨서는 안 되는 16개의 번호 매긴 규칙인 Floor, 모델이 빠지기 쉬운 기본값을 다루는 더 긴 Reflex gate 표, 50개 테마 카탈로그를 둡니다. 각 테마는 최대 8 KB인 파일 하나로, 종이, 서체, 팔레트, 표면을 설명하지만 레이아웃은 다루지 않습니다. 빌드는 실제 자료를 한 번 요청하고, 테마 세 개를 고르고, 히어로부터 만든 뒤, 번들된 린터 sloplint를 실행하고 나서 새 컨텍스트의 서브에이전트가 페이지를 검토합니다.
npx skills add nutlope/hallmark -g로 Claude Code와 Codex CLI 폴더에 설치하며, Cursor와 OpenCode도 이 폴더를 읽습니다. Claude Code 플러그인으로도 배포됩니다. Node 18 이상이 필요하고, 브라우저 검사에는 puppeteer-core와 Chrome이 필요합니다. /hallmark redesign과 /hallmark audit 명령은 기존 페이지에 작동하며, 그 밖에는 기존 페이지를 건드리지 않습니다.
저장소는 MIT 라이선스이고 GitHub 스타 약 43,800개, 포크 2,300개이며, 2026년 4월에 만들어졌습니다. GitHub 릴리스는 없습니다. 스킬은 버전 2.0.0이고 마지막 커밋은 2026년 10월 29일입니다. 유료 요소는 없습니다. 사이트에 따르면 API 키가 필요 없으며, 선택 사항인 TOGETHER_API_KEY는 Together AI를 통한 이미지 생성만 켭니다.
Hallmark, 쓸 만한 가치가 있습니까?
Hallmark는 우리가 읽어 본 디자인 스킬 중 가장 규범적이며, 그것이 강점입니다. Anthropic의 frontend-design과 Impeccable이 주로 에이전트에게 참고할 더 나은 감각을 준다면, Hallmark는 티 나는 특징을 검사 가능한 규칙으로 적어 두고 실제로 검사합니다. SKILL.md는 예외 없이 다음을 금지합니다. 보라에서 파랑으로 가는 그라디언트, 카드 안의 카드, 아이콘으로 쓴 이모지, 정자체 제목 속 이탤릭 단어 하나, 제목 위의 eyebrow 라벨, 자간을 벌린 대문자로 조판한 모든 라벨입니다. 모든 색과 글꼴은 :root의 토큰을 거쳐야 하고, transition: all은 금지되며, 헤드라인과 한 문장, 주 버튼이 1280 x 800 창에 들어가야 하고, 어떤 화면도 약 80단어를 넘으면 안 됩니다. gates.md의 더 자세한 표는 한발 더 나갑니다. 디스플레이 서체로 쓴 Inter, Roboto, Poppins, indigo-500 같은 Tailwind 기본 색상, 섹션 사이 120px 미만의 간격, 마지막 섹션의 이메일 가입란은 모두 Reflex 특징으로 분류되어, 빌드가 고치거나 글로 정당화해야 합니다.
결과물에서 달라지는 것은 페이지의 색만큼이나 형태입니다. 에이전트는 처음에 사진, 스크린샷, 실제 수치를 묻는 질문을 하나 하고, 지표나 추천사, 로고 모음을 지어내지 않습니다. 사진이 없으면 Wikimedia Commons의 공개 라이선스 이미지 755장 목록에서 출처를 표기한 그림을 넣습니다. 50개 테마 중 세 개를 고르되 이전 빌드 기록에 있는 것은 피해 연속된 페이지가 비슷해지지 않게 하고, 히어로만 먼저 만들어 검토한 다음, 8가지 너비에서 sloplint를 돌리고 새 컨텍스트의 서브에이전트에게 페이지를 넘깁니다. 결과는 독립된 HTML과 CSS이며, 첫 CSS 주석에 내린 결정이 기록됩니다. 제작자 사이트는 Opus 5.5 단독으로는 문제 26건, Hallmark를 쓰면 0건이라고 보여 주지만, 그 수치는 Hallmark 자체 린터가 자체 규칙으로 매긴 것이어서 품질보다는 규칙 준수를 잽니다.
비용은 컨텍스트입니다. SKILL.md는 페이지 빌드에서 layout, anatomy, imagery, craft, genre, theme, patterns 파일과 gates.md의 네 섹션을 읽으라고 지시합니다. 저장소에서 이 파일들은 39 KB인 gates.md를 빼고도 약 95 KB이며, 4자당 1토큰이라는 통상 기준으로 마크업을 쓰기 전에 대략 25,000에서 35,000토큰의 지시문이 됩니다. 스킬 스스로 더 많이 읽어 들이는 것을 '피할 수 있는 가장 큰 비용'이라고 부르고, 로드맵은 빌드의 시간과 토큰 비용 측정을 미완 과제로 올려 두었으므로 공식 수치는 없습니다. 프로토타입용 빠른 모드가 있고, puppeteer-core와 Chrome이 없으면 정적 린트만 실행됩니다.
토큰 비용보다 중요한 한계가 두 가지 있습니다. 스킬은 프롬프트이지 보증이 아닙니다. 에이전트는 단계를 건너뛸 수 있고, 메인테이너의 평가 기록에는 claude -p에서 스킬이 스스로 발동하지 않아 이름을 불러야 했다고 적혀 있습니다. 그리고 그 감각은 하우스 스타일입니다. 자간을 벌린 대문자 라벨, 테라코타 포인트를 얹은 크림색 종이, 마지막 뉴스레터 띠를 금지하는 것은 근거가 있지만 취향이 강합니다. 자체 시스템이 있는 팀은 이를 design.md에 적어야 하며, Hallmark는 이 파일을 먼저 읽고 다른 모든 것보다 우선합니다. 태그된 릴리스가 없고 열린 이슈와 풀 리퀘스트가 68개라는 점에서 아직 젊은 프로젝트이기도 합니다. 한 줄 프롬프트로 새 랜딩 페이지를 만드는 일이라면 Impeccable보다 강한 도구입니다. 버튼이나 설정 화면이라면 이 장치는 필요 이상입니다.
제 역할을 하는 곳
webhook API의 랜딩 페이지를 내놓는 1인 창업자
다른 생성형 SaaS 사이트와 똑같아 보이지 않는 페이지 얻기
제품 URL과 함께 /hallmark를 실행합니다. 실행 중인 앱의 스크린샷을 찍고, modern-minimal 장르에서 테마 세 개를 고르고, 페이지를 린트한 뒤 돌려줍니다. 무료이며, 비용은 큰 지시문 부담과 검토 서브에이전트 두 개가 쓰는 에이전트 토큰입니다.
고객사의 낡은 마케팅 사이트를 넘겨받은 10인 에이전시의 프런트엔드 개발자
폼, 링크, 추적 훅을 하나도 잃지 않고 스타일 바꾸기
/hallmark redesign ./site는 sloplint --before로 모든 링크, 필드, 핸들러, 제목을 기록하고, 하나라도 사라지면 --kept로 실행을 실패 처리합니다. 스타일만 바꾸려면 keep the layout, 티 나는 특징만 다듬으려면 polish라고 말합니다. 결과물은 전후를 나란히 놓은 비교입니다.
엔지니어들이 코딩 에이전트로 페이지를 생성하는 팀의 디자인 리드
페이지가 리뷰에 오르기 전에 생성된 티를 잡아내기
출력물에 node skills/hallmark/scripts/sloplint.mjs를 --render와 함께 실행하거나, 아무것도 바꾸지 않는 보고서를 위해 /hallmark audit를 실행합니다. 린 터는 HTML, CSS, 프레임워크 컴포넌트, Tailwind 클래스를 읽습니다. 일부 규칙은 하우스 취향이므로 몇 개는 기록을 남기고 면제할 각오를 해야 합니다.
도입 전 확인할 점
- 설정
- npx skills add nutlope/hallmark -g(한 프로젝트에만 쓰려면 -g를 빼고, 특정 하네스를 지정하려면 --agent 추가), 또는 Claude Code에서 /plugin marketplace add nutlope/hallmark 후 /plugin install hallmark@hallmark. Node 18 이상이 필요하고, 렌더 검사에는 npm i -g puppeteer-core와 Chrome이 필요합니다. /hallmark <prompt>로 호출합니다(Codex에서는 $hallmark).
- 연동
- Claude Code, Codex CLI, Cursor, OpenCode를 지원하며 GitHub Copilot도 설치 대상입니다. 프로젝트의 design.md, Tailwind 설정, 토큰을 읽습니다. 선택 사항인 Inspo MCP 서버, Claude Code용 옵트인 편집 시점 Floor 훅, 선택 사항인 Together AI 이미지 생성(기본값 FLUX.1.1-pro)이 있습니다.
- 데이터와 개인정보
- 로컬에서 실행되어 프로젝트에 파일을 쓰며, 빌드 로그와 사전 점검 캐시가 담긴 .hallmark/ 폴더도 만듭니다. 라이브러리 사진은 Wikimedia Commons에 호스팅되며 각자의 CC0, 퍼블릭 도메인, CC BY, CC BY-SA 라이선스를 유지합니다. 프롬프트는 TOGETHER_API_KEY가 설정된 경우에만 Together AI로 갑니다. README와 SKILL.md에는 텔레메트리에 관한 설명이 없습니다. MIT 라이선스.
- 대규모 사용 시 비용
- 유료 등급이나 호스팅 에디션은 없습니다. 실제 비용은 에이전트 토큰입니다. 페이지 빌드 한 번에 약 95 KB의 지시문 파일과 39 KB짜리 gates 파일의 일부를 읽고, 새 컨텍스트 검토를 두 번 돌립니다. 생성 이미지는 사용자 자신의 Together AI 계정으로 청구됩니다.
- 제한
- 웹사이트와 새 페이지용으로 만들어졌고, 컴포넌트와 앱 화면은 축소된 범위로 다룹니다. 이름으로 지정하지 않으면 기존 디자인은 건드리지 않습니다. 태그된 릴리스가 없고 열린 이슈와 풀 리퀘스트는 68개입니다. 스킬이 스스로 발동하지 않을 수 있고, 메인테이너는 측정한 토큰 비용을 공개하지 않았습니다.
좋은 점
- 생성된 페이지의 흔한 특징을 구체적이고 검사 가능하게 금지
- 번들된 sloplint가 실제 브라우저에서 8가지 너비로 페이지 검사
- 지표, 인용, 로고를 지어내지 않고 모든 사진의 출처 표기
- redesign 모드는 링크, 필드, 핸들러가 사라지면 실패 처리
아쉬운 점
- 빌드마다 지시문 부담이 크고 토큰 비용이 공개되지 않음
- 일부 팀은 반발할 만한 취향이 강한 하우스 스타일
- 브라우저 검사에 puppeteer-core와 Chrome 필요
- 태그된 릴리스가 없고 이름을 부르지 않으면 발동하지 않을 수 있음
추천 대상
Claude Code, Codex, Cursor, OpenCode로 마케팅 페이지와 랜딩 페이지를 만들면서, 다른 생성 사이트와 똑같아 보이지 않기를 원하는 개발자.
Hallmark 대안
Hallmark: 자주 묻는 질문
- Hallmark, 쓸 만한 가치가 있습니까?
- Hallmark는 디자인 감각을 에이전트가 어길 수 있는 규칙으로 바꿉니다. 덕분에 페이지가 생성된 것이 아니라 만든 것처럼 보이지만, 그 대가인 컨텍스트 비용은 아직 아무도 측정하지 않았습니다. 평점은 5점 만점에 4.1점입니다.
- Hallmark의 가격은 얼마입니까?
- 무료 오픈소스(MIT)입니다. 선택 사항인 TOGETHER_API_KEY를 넣으면 이미지 생성을 쓸 수 있으며, 비용은 Together AI가 청구합니다.
- Hallmark의 단점은 무엇입니까?
- 빌드마다 지시문 부담이 크고 토큰 비용이 공개되지 않음; 일부 팀은 반발할 만한 취향이 강한 하우스 스타일; 브라우저 검사에 puppeteer-core와 Chrome 필요; 태그된 릴리스가 없고 이름을 부르지 않으면 발동하지 않을 수 있음.
- Hallmark에 적합 한 사람은 누구입니까?
- Claude Code, Codex, Cursor, OpenCode로 마케팅 페이지와 랜딩 페이지를 만들면서, 다른 생성 사이트와 똑같아 보이지 않기를 원하는 개발자.
- 팀이나 프로덕션 환경에서 Hallmark의 비용은 얼마입니까?
- 유료 등급이나 호스팅 에디션은 없습니다. 실제 비용은 에이전트 토큰입니다. 페이지 빌드 한 번에 약 95 KB의 지시문 파일과 39 KB짜리 gates 파일의 일부를 읽고, 새 컨텍스트 검토를 두 번 돌립니다. 생성 이미지는 사용자 자신의 Together AI 계정으로 청구됩니다.
- Hallmark에 회사 데이터를 맡겨도 안전합니까?
- 로컬에서 실행되어 프로젝트에 파일을 쓰며, 빌드 로그와 사전 점검 캐시가 담긴 .hallmark/ 폴더도 만듭니다. 라이브러리 사진은 Wikimedia Commons에 호스팅되며 각자의 CC0, 퍼블릭 도메인, CC BY, CC BY-SA 라이선스를 유지합니다. 프롬프트는 TOGETHER_API_KEY가 설정된 경우에만 Together AI로 갑니다. README와 SKILL.md에는 텔레메트리에 관한 설명이 없습니다. MIT 라이선스.
- Hallmark의 가장 좋은 대안은 무엇입니까?
- 저희가 리뷰한 것 중 가장 가까운 대안은 Impeccable, OpenDesign 및 Anthropic Skills입니다.
답변 확인일: 2026년 10월 31일.
Hallmark 개발사입니까? 이 평점을 사이트에 표시하십시오
