테이스트|잘된 사이트 디자인 역설계

마음에 드는 사이트 주소를 주면 그 디자인을 뜯어 색·간격·글꼴 같은 수치로 뽑아 줍니다. 여기서 그치지 않고 "왜 이렇게 했는가"까지 정리해 주기 때문에 그대로 베끼는 대신 내 화면에 옮겨 적용할 수 있습니다.

도도리 AI연구소 · 최종 수정 2026년 10월 7일 · CC BY-NC 4.0

디자인 분야 · 디자인·이미지 용도 · 개발자용입니다.

taste-skill 스킬 설치 한 줄

저장소를 내려받아 설정 스크립트를 돌리는 방식입니다. 이 방식은 명령을 여러 줄 치므로 터미널이 편합니다. 데스크톱 앱·웹·편집기 확장에서도 명령 입력 칸에 같은 줄을 넣으시면 됩니다.

taste-skill 스킬 설치 절차 전체

위 한 줄에서 막히셨다면 여기를 보십시오. 터미널로 쓰시는 분을 위해 터미널 여는 법부터 확인 명령까지 순서대로 적어 두었습니다. 데스크톱 앱·웹·편집기 확장으로 쓰시면 터미널 여는 단계는 건너뛰고 명령 입력 칸에 같은 줄을 넣으시면 됩니다.

# taste-skill 설치

## 1. 저장소를 내려받습니다

git clone https://github.com/senlindesign/taste-skill ~/.claude/skills/taste

## 2. 안내에 따라 설정합니다

내려받은 폴더의 README 에 설정 절차가 있습니다.
다른 도구를 쓰신다면 --host 옵션으로 지정합니다.

## 3. Claude 를 다시 시작합니다

## 주의

클론 방식은 자동 갱신이 되지 않습니다.
가끔 저장소를 다시 받아 최신으로 맞추십시오.

이렇게 시켜 보세요

넣고 나서 바로 던져 볼 수 있는 지시문입니다. 누르면 복사됩니다.

알아 둘 것

taste-skill 스킬 안 될 때 확인할 것

Playwright MCP 를 함께 설치해야 합니다

브라우저를 직접 열어 분석하는 방식이라 이 스킬만으로는 동작하지 않습니다.

언제 쓰고, 언제 안 쓰나

레퍼런스 사이트는 정해 뒀는데 그 느낌을 내 화면에 어떻게 옮길지 막막할 때 씁니다.

비슷한 것 중에 왜 이걸

frontend-design 은 피할 것을 알려주고, ui-ux-pro-max 는 업종에 맞는 답을 정해 주며, 이건 내가 지목한 사이트를 뜯습니다. 셋 중에 기준이 밖에 있는 것은 이것뿐이라, 닮고 싶은 대상이 이미 정해졌을 때만 값이 있습니다. 수치만 뽑는 것이 아니라 왜 그렇게 했는지까지 정리해 주기 때문에, 그대로 베끼지 않고 내 화면에 옮길 수 있습니다.

디자인 도구를 고를 때

Figma 등 디자인 툴과 연동합니다. 팀 플랜이 필요한 기능인지, 읽기 권한만 요구하는지 편집 권한까지 요구하는지 확인하세요.

원본 보기

스킬의 실제 내용은 SKILL.md 파일 하나에 들어 있습니다. 넣기 전에 한 번 읽어 보시는 것을 권합니다. 스킬은 Claude 에게 그대로 들어가는 지시문이라, 무엇을 시키는지 확인하지 않고 쓰면 의도치 않은 동작을 할 수 있습니다.

GitHub 에서 senlindesign/taste-skill 열기

별점과 댓글

이 스킬을 써 보신 분의 별점(5점 만점)과 한마디입니다. 작성자는 아이디 앞 3자만 보입니다(예: wor****). 읽는 데는 제한이 없고, 남기는 것은 로그인한 회원만 됩니다. 한 사람이 한 번이며 다시 쓰면 앞의 것을 덮어씁니다.

자주 묻는 것

테이스트 스킬(taste-skill)은 어떻게 설치합니까?

터미널에 git clone https://github.com/senlindesign/taste-skill ~/.claude/skills/taste 한 줄이면 됩니다.

테이스트 스킬은 무엇을 합니까?

마음에 드는 사이트 주소를 주면 그 디자인을 뜯어 색·간격·글꼴 같은 수치로 뽑아 줍니다. 여기서 그치지 않고 "왜 이렇게 했는가"까지 정리해 주기 때문에 그대로 베끼는 대신 내 화면에 옮겨 적용할 수 있습니다.

테이스트 스킬은 언제 씁니까?

레퍼런스 사이트는 정해 뒀는데 그 느낌을 어떻게 내 화면에 옮길지 막막할 때입니다. 레퍼런스 사이트는 정해 뒀는데 그 느낌을 내 화면에 어떻게 옮길지 막막할 때 씁니다.

테이스트 스킬을 쓸 때 걸리는 데가 있습니까?

Playwright MCP 를 함께 설치해야 합니다. 브라우저를 직접 열어 분석하는 방식이라 이 스킬만으로는 동작하지 않습니다.

함께 보면 좋은 스킬

어느 것부터 깔지 모르겠다면 클로드 스킬 추천 15개를 보십시오. 67개를 직접 깔아 보고 골랐습니다.