Designmd.fun

Designmd.fun은 UI 리버스 엔지니어링 및 AI 컨텍스트 생성 도구입니다. 공개 웹사이트의 URL을 붙여넣으면 실제 방문자가 보는 그대로 페이지를 렌더링하고, 그 이면의 디자인 시스템을 분석한 뒤, 완전한 기계 판독 가능 문서 파일 세트를 작성합니다.

사이트에 따르면, 한 번의 분석으로 URL당 10개의 AI용 파일이 생성됩니다: 프로덕션용 design.md, tailwind.config.ts, tokens.json, components.md, animations.md, prompt.md, figma.json, css-vars.css 그리고 색상 및 타이포그래피 JSON입니다. 각 파일은 동시에 생성되고 서로 참조되어 결과물 간의 일관성이 유지됩니다.

워크플로는 의도적으로 짧습니다: URL을 붙여넣고, 분석기가 색상을 역할로, 서체를 스케일로, 간격을 리듬으로 정리하도록 한 뒤, 파일 세트를 생성하고, 저장소에 넣거나 코딩 에이전트에 바로 붙여넣을 수 있는 ZIP을 다운로드합니다. 추출된 팔레트는 빠른 복사를 위해 클릭 가능한 견본(스와치)으로 표시됩니다.

도구가 추출하는 모든 것은 렌더링된 페이지에서 나온 것으로 설명되며, 디자인 시스템, UI 컴포넌트, 레이아웃 그리드, 브레이크포인트, 애니메이션 및 모션, 테두리 반경, 그림자, 글꼴, 아이콘, 색상 팔레트, 접근성을 포괄합니다. 출력물은 Claude Code, Cursor, Windsurf, ChatGPT, Lovable, Bolt, v0, GitHub Copilot을 대상으로 하며, Claude, Cursor, Windsurf, Lovable, v0용 복사 준비된 프롬프트 타기팅을 제공합니다.

Designmd.fun은 또한 사전 분석된 프로덕션 디자인 시스템 라이브러리를 게시합니다 — Stripe, Linear, Vercel, Notion, Framer, Raycast, Supabase, Airtable, Cursor, PostHog, Resend, Warp, Webflow가 목록에 포함되어 있습니다 — 따라서 직접 분석을 실행하지 않고도 참고 문서를 둘러볼 수 있습니다. 사이트는 시험 사용에 가입이 필요 없다고 명시합니다.

Designmd.fun 사용 방법

1. 사이트를 엽니다. designmd.fun으로 이동하여 "분석할 웹사이트 URL" 아래의 URL 입력란을 찾습니다.
2. 공개 URL을 붙여넣습니다. 공개 웹사이트 도메인(예: stripe.com)을 입력하거나 샘플 링크(stripe.com, linear.app, github.com, vercel.com) 중 하나를 선택합니다. 도구는 방문자가 보는 그대로 페이지를 렌더링합니다.
3. AI가 분석하도록 합니다. 색상은 역할별로, 타이포그래피는 스케일로, 간격은 리듬으로 정리됩니다.
4. 파일을 생성합니다. 10가지 형식이 한 번에 생성되며 일관성을 위해 상호 참조됩니다.
5. ZIP을 다운로드하여 저장소에 넣거나, 내보내기 패널에서 Claude, Cursor, Windsurf, Lovable 또는 v0용으로 미리 만들어진 프롬프트를 바로 복사합니다.
6. 선택 사항: 참고 문서만 필요한 경우 사전 분석된 디자인 라이브러리(Stripe, Linear, Vercel, Notion 등)를 둘러볼 수 있습니다.

Designmd.fun은 지원 이메일 주소 support@designmd.fun을 안내합니다. 제공된 자료에는 추가 지원 채널, 문서 포털 또는 응답 시간 약속이 표시되어 있지 않습니다.