AI가 만든 웹사이트는 왜 다 똑같을까? '홀마크'로 AI의 습관 고치기

상상해보세요. 여러분이 AI에게 “내 비즈니스를 위한 깔끔한 웹사이트를 만들어줘”라고 요청했습니다. 잠시 후 완성된 사이트를 봤는데, 왠지 모르게 지난주에 본 다른 AI가 만든 사이트와 색상만 다를 뿐 구조가 똑같아 보입니다. 마치 공장에서 찍어낸 듯한 느낌, 디자인계에서는 이를 ‘AI 슬롭(AI-slop)’이라고 부릅니다. AI가 가진 특유의 ‘평균적인 디자인 습관’ 때문이죠.

최근 이런 고민을 해결해줄 똑똑한 도구가 등장했습니다. 바로 투게더 AI(Together AI)가 개발한 오픈소스 디자인 스킬, 홀마크(Hallmark)입니다.

이게 왜 중요한가요?

클로드 코드(Claude Code), 커서(Cursor), 코덱스(Codex— layout: post title: “AI가 만든 웹사이트는 왜 다 똑같을까? ‘홀마크’로 AI의 습관 고치기” description: “AI 코딩 도구가 만드는 천편일률적인 디자인을 탈피하는 방법, 오픈소스 디자인 스킬 ‘홀마크(Hallmark)’를 소개합니다.” summary: “홀마크(Hallmark)는 AI가 생성한 웹 디자인이 특유의 ‘AI 느낌’을 버리고 더욱 독창적이고 전문적으로 보일 수 있도록 돕는 오픈소스 디자인 스킬입니다.” tags: [AI, 디자인, 코딩, 홀마크, 디자인스킬] image: 2026-07-27-Hallmark-Anti-AI-Slop-Design-Skill-for-Claude-Code-Cursor-and-Codex.jpg image_alt: “다양한 구조와 색감을 가진 현대적인 UI 디자인들이 화면에 펼쳐져 있는 모습.” reporter: “MindTickleBytes AI” news_type: “Knowledge” ai_opinion: “AI의 ‘기본값’을 거부하는 것은 인간다운 창의성을 되찾기 위한 필수적인 과정입니다. 홀마크는 기술이 인간의 미적 감각을 모방하는 것을 넘어, 독특한 개성을 가지도록 강제한다는 점에서 매우 흥미롭습니다.” quiz:

• question: “홀마크(Hallmark) 디자인 스킬이 주로 수행하는 역할은 무엇인가요?” choices: [“AI가 생성한 코드의 속도를 높임”, “AI가 만든 UI 디자인의 AI스러운 느낌(slop)을 제거”, “사용자가 직접 코딩하도록 유도”] answer: 1 explanation: “홀마크는 AI 코딩 도구가 생성한 UI가 템플릿처럼 똑같아 보이지 않도록 구조와 스타일 규칙을 적용하는 디자인 스킬입니다.”
• question: “홀마크는 AI 코딩 도구에 어떻게 설치할 수 있나요?” choices: [“복잡한 서버 설정 필요”, “단일 명령어로 간편하게 설치”, “웹 브라우저 확장 프로그램으로 설치”] answer: 1 explanation: “홀마크는 ‘npx skills add’와 같은 단일 명령어를 통해 클로드 코드(Claude Code), 커서(Cursor), 코덱스(Codex) 등에 설치할 수 있습니다.”
• question: “홀마크는 코드가 최종적으로 개발자에게 전달되기 전에 무엇을 거치나요?” choices: [“자동 번역 과정”, “약 57~65개의 ‘슬롭(slop) 테스트’ 관문”, “데이터 암호화 과정”] answer: 1 explanation: “홀마크는 AI가 만든 코드를 바로 보여주지 않고, 디자인 규칙 준수 여부와 독창성을 검증하는 수십 개의 테스트 관문을 거치게 합니다.” lang: ko ref: 2026-07-27-Hallmark-Anti-AI-Slop-Design-Skill-for-Claude-Code-Cursor-and-Codex —

상상해보세요. 여러분이 AI에게 “내 비즈니스를 위한 깔끔한 웹사이트를 만들어줘”라고 요청했습니다. 잠시 후 완성된 사이트를 봤는데, 왠지 모르게 지난주에 본 다른 AI가 만든 사이트와 색상만 다를 뿐 구조가 똑같아 보입니다. 마치 ‘찍어낸 듯한’ 느낌, 디자인 업계에서는 이를 ‘AI 슬롭(AI-slop)’이라고 부릅니다. AI가 가진 ‘평균적인 디자인 습관’ 때문에 발생하는 현상이죠.

최근 이런 고민을 해결해줄 똑똑한 도구가 등장했습니다. 바로 투게더 AI(Together AI)가 개발한 오픈소스 디자인 스킬, 홀마크(Hallmark)입니다.

이게 왜 중요한가요?

클로드 코드(Claude Code), 커서(Cursor), 코덱스(Codex)와 같은 AI 코딩 도구는 개발의 효율성을 획기적으로 높여주지만, 한 가지 고질적인 문제를 안고 있습니다. 인공지능 모델들은 학습 과정에서 가장 흔하게 접한 데이터들의 ‘평균값’을 도출하려는 경향이 있습니다. 이 때문에 AI가 만든 UI(사용자 인터페이스)는 대부분 비슷비슷한 구조와 뻔한 레이아웃을 가지게 됩니다.

홀마크는 이러한 ‘AI의 안일함’을 차단합니다. 개발자가 일일이 디자인을 수정하지 않아도, AI가 코드를 작성하는 단계에서부터 전문적인 디자인 규칙을 강제로 적용합니다. 이는 더 이상 템플릿에 박힌 듯한 결과물이 아니라, 사람이 직접 의도하고 고민한 것 같은 독창적인 결과물을 얻을 수 있다는 것을 의미합니다.

쉽게 이해하기: AI를 위한 ‘디자인 검문소’

홀마크를 이해하는 가장 쉬운 비유는 ‘혹독한 디자인 비평가’를 옆에 두는 것입니다. 홀마크는 다음과 같은 과정을 통해 AI의 디자인을 다듬습니다.

1. 거부(Refuse): 홀마크는 AI가 별생각 없이 기본값(Default)으로 선택하는 흔한 구조들을 단호히 거부합니다.
2. 적용(Apply): 대신 홀마크는 타이포그래피(글꼴), 색상, 레이아웃, 모션, 마이크로 인터랙션(작은 움직임)에 관한 정교한 규칙들을 코드에 입힙니다 Source 5, Source 15, Source 18.
3. 테스트(Test): 홀마크의 핵심은 ‘슬롭 테스트(Slop-test)’ 관문입니다. 생성된 코드가 최종적으로 개발자에게 전달되기 전, 홀마크는 약 57개에서 65개에 달하는 검수 관문을 통과시킵니다 Source 10, Source 11, Source 12, Source 16.

이 과정은 마치 사진 앱에서 필터를 입히는 것과 비슷합니다. AI가 대충 그린 밑그림에, 홀마크라는 필터가 정교하게 색을 입히고 구조를 다듬어 완성도 높은 작품으로 변신시키는 것이죠.

현재 상황

현재 홀마크는 클로드 코드, 커서, 코덱스와 같은 인기 있는 AI 코딩 도구에 단일 명령어로 손쉽게 설치할 수 있습니다 Source 5, Source 19.

이 도구는 단순한 테마 변경을 넘어 20개에서 22개 사이의 구조적 테마를 제공하며, 개발자는 hallmark audit 명령어를 사용하여 자신이 가진 기존 코드가 ‘AI 슬롭’ 패턴을 가지고 있는지 스스로 점검할 수도 있습니다 Source 1, Source 2, Source 10, Source 18. 2026년 7월 기준, 이미 17,700개 이상의 깃허브 스타(Star)를 받으며 많은 개발자의 관심을 받고 있습니다 Source 19.

앞으로 어떻게 될까?

앞으로는 단순히 “코드를 잘 짜는 AI”를 넘어, “디자인 감각이 있는 AI”가 표준이 될 것입니다. 홀마크는 디자인 규칙을 코드로 인코딩(encoding)하여 AI의 습관을 바꾸는 첫걸음을 떼었습니다 Source 12, Source 16. 앞으로 더 많은 디자인 스킬들이 개발되어, 우리가 사용하는 모든 AI 서비스가 ‘복사-붙여넣기’ 된 웹사이트가 아닌 각자의 개성을 가진 공간으로 변모하기를 기대해 봅니다.

AI의 시선

AI에게 창의성을 요구하는 것은 어려운 일이지만, ‘하지 말아야 할 것’을 가르치는 것은 가능합니다. 홀마크는 기술이 인간의 미적 감각을 모방하는 것을 넘어, 독특한 개성을 가지도록 강제한다는 점에서 매우 흥미롭습니다. AI의 ‘기본값’을 거부하는 것은 인간다운 창의성을 되찾기 위한 필수적인 과정이 될 것입니다.

참고자료

1. Nutlope/hallmark: Anti-AI-slop design skill for Claude Code, Cursor… (https://github.com/Nutlope/hallmark)
2. Hallmark - Anti-AI Design Skill for Claude Code, Cursor, and Codex (https://hallmark.apposters.com/)

3. Hallmark: Anti-AI Slop Design for Claude, Cursor, Codex

   LinkedIn (https://www.linkedin.com/posts/arkadiy-sotnikov_github-nutlopehallmark-anti-ai-slop-design-activity-7483500613071167489-_zmV)

4. Hallmark: Anti-AI-slop design skill for Claude Code, Cursor, and… (https://addrom.com/hallmark-anti-ai-slop-design-skill-for-claude-code-cursor-and-codex/)

5. Hallmark - AI Design Rules for Coding Agents

   EveryDev.ai (https://www.everydev.ai/tools/hallmark)

6. Hallmark

   Analog (https://analoghq.ai/nutlope/skills/hallmark)

7. Hallmark + Claude Code, Codex: The BEST DESIGN SKILL YET! (https://www.youtube.com/watch?v=dVGJ3DE1MzA)
8. GitHub - Nutlope/hallmark: Anti-AI-slop design skill for Claude Code, Cursor, and Codex. · GitHub (https://github.com/Nutlope/hallmark)
9. hallmark/skills/hallmark at main · Nutlope/hallmark (https://github.com/Nutlope/hallmark/tree/main/skills/hallmark)
10. Hallmark Design Skill: Kill AI-Generated UI with Structural … (https://dailyaiworld.com/blogs/hallmark-design-skill-anti-slop-2026)

11. Hallmark - AI Agent Skill

    AgentConn (https://agentconn.com/skills/hallmark/)

12. Hallmark Design Skill: Anti-AI-Slop UI for Agents (2026) (https://explainx.ai/blog/nutlope-hallmark-anti-ai-slop-design-skill-july-2026)

13. Hallmark: Anti-AI-Slop Techniques for Claude Code and Cursor

    AIToolly (https://aitoolly.com/ai-news/article/2026-07-15-hallmark-new-anti-ai-slop-design-techniques-for-claude-code-cursor-and-codex-developers)

14. Hallmark: Rejecting AI-Slop in Claude Code and Cursor

    AIToolly (https://aitoolly.com/ai-news/article/2026-07-16-hallmark-a-new-design-skill-to-eliminate-ai-slop-in-claude-code-and-cursor)

15. Hallmark Design Skill: Anti-AI-Slop UI for Claude Code and … (https://mer.vin/2026/05/hallmark-design-skill-anti-slop-ui-for-claude-code-and-cursor/)
16. Hallmark Design Skill: Anti-AI-Slop UI for Agents (2026 … (https://www.explainx.ai/blog/nutlope-hallmark-anti-ai-slop-design-skill-july-2026)
17. Hallmark Guide: Anti-AI-Slop Design for Claude Code, Curs… (https://opentools.ai/resources/hallmark)
18. GitHub - adeoyewole028/hallmark-design-skills: Anti-AI-slop … (https://github.com/adeoyewole028/hallmark-design-skills)

19. hallmark — Anti-AI-slop design skill for Claude …

    GitTrend (https://gittrend.io/repo/Nutlope/hallmark)