DesignMD는 웹사이트 URL 하나만 넣으면 그 사이트의 디자인 시스템을 AI로 추출해 주는 도구입니다. 구조화된 DESIGN.md 파일, 바로 볼 수 있는 HTML 프리뷰, 원클릭 Figma 임포트까지 한 번에 나옵니다.
마음에 드는 사이트를 보고 "이런 느낌으로 만들고 싶다"고 생각해도, 그 느낌을 색상값·폰트·간격 같은 구체적인 수치로 옮기는 일은 손이 많이 갑니다. DesignMD는 그 과정을 자동화해서, 실제 사이트가 쓰는 정확한 토큰 값을 추측이 아니라 그대로 뽑아냅니다.
주요 특징
- URL만 입력하면 끝: 분석할 사이트 주소를 붙여넣으면 주요 페이지를 크롤링해 스타일을 읽어냅니다.
- 구조화된 DESIGN.md 생성: 색상, 타이포그래피, 간격 등을 에이전트가 바로 읽을 수 있는 형식으로 정리합니다.
- 라이브 HTML 프리뷰: 추출된 디자인 시스템을 실제 컴포넌트로 렌더링해서 눈으로 확인할 수 있습니다.
- Figma 원클릭 임포트: 추출한 변수와 스타일을 Figma로 바로 가져와 보드에 구성합니다.
- 멀티 페이지 분석: 한 페이지가 아니라 사이트의 여러 페이지를 함께 분석하는 옵션을 제공합니다.
이런 분에게 잘 맞습니다
- 레퍼런스 사이트의 디자인 시스템을 빠르게 파악하고 싶은 디자이너
- AI 코딩 에이전트에게 넘길 정확한 디자인 토큰이 필요한 개발자
- 경쟁사·벤치마킹 사이트의 스타일 구조를 분석하고 싶은 팀
- Figma 작업을 코드 기반 디자인 시스템과 맞춰가고 싶은 사용자
크레딧 기반으로 동작하며(1회 분석당 4크레딧), 카드 등록 없이 바로 시작할 수 있습니다. Apple, Stripe, Linear 같은 사이트를 예시로 시도해 볼 수 있습니다.