CSS Crème

설치

쓰고 있는 AI 앱을 고른 다음 설정을 복사하세요.

검사 5/5 통과 · 내가 묻는 내용은 제작자 서버(csscreme.com)를 거쳐요

claude mcp add --transport http --scope user design-systems https://csscreme.com/mcp

{
  "mcpServers": {
    "design-systems": {
      "url": "https://csscreme.com/mcp"
    }
  }
}

{
  "servers": {
    "design-systems": {
      "type": "http",
      "url": "https://csscreme.com/mcp"
    }
  }
}

어떤 앱에서 쓸 수 있나요

이 서버의 연결 방식과 각 앱의 공식 문서를 바탕으로 했어요. 2026년 11월 10일 확인.

인터넷으로 연결하는 앱

ClaudeChatGPTGooseLM StudioMsty StudioCherry StudioCursorVS Code + GitHub CopilotVisual StudioWindsurf (Devin Desktop)ZedKiroClineContinueJetBrains AI AssistantClaude CodeCodex CLIGemini CLIOpenCodenodecodeWarpLibreChatOpen WebUIRaycast

모든 앱과 장단점 →

할 수 있는 일

도구 이름과 설명은 서버가 2026년 11월 8일에 알려 준 그대로예요. 우리가 아니라 제작자가 쓴 글이고, 일반 텍스트로만 보여 드려요.

• search_themes

  Find a design system by describing what you are building ("dark developer tool", "calm fintech dashboard", "playful consumer app"). Returns matching themes with their DESIGN.md URL and shadcn install command. Call this first when the user has no design system defined.

• list_themes

  Browse the full catalogue of curated themes and templates. Use when the user wants to see options rather than search for one.

• get_design_md

  Fetch the full DESIGN.md for one theme: semantic colour roles, the complete shadcn token set in light and dark, typography, radius, spacing, MEASURED WCAG contrast ratios, and numbered rules the generated UI must follow. Read this before writing any UI. Save it at the repo root a

• get_theme_tokens

  Get the shadcn/ui registry item (OKLCH tokens, light and dark) plus the paste-ready CSS variables for one theme, and the one-line command that installs it for real. Use after get_design_md when you are ready to write the tokens into globals.css.

• how_to_use

  Explains where a DESIGN.md belongs for a given coding agent (Claude Code, Cursor, v0, Codex, Lovable) so the design rules apply to every session rather than one message.

• get_install_command

  Return the exact `npx shadcn@latest add ` command that installs one theme into a shadcn/ui project, plus the registry URL it reads. Use when the user says "install it" and you already know the id.

• get_agent_rules

  Return a short standing-instructions block that makes every future session read DESIGN.md before touching UI. Paste it whole into CLAUDE.md, AGENTS.md or .cursor/rules/design.mdc. It points at the DESIGN.md rather than restating it, and carries the token fingerprint so drift is d

• decode_url

  Fetch a public site's HTML and stylesheets and return what its CSS declares: named custom properties that look like design tokens, the colours it uses most, its font stacks, border radii, spacing values, and the framework it appears to be built with. Also returns a "drop" report:

• css_feature

  Answers two questions about a modern CSS feature with data instead of recall. First, its Baseline status (widely available, newly available, or limited availability), the date, and which core browsers lack it, read from the open web-features dataset at build time. Second, how man

• get_design_md_for_url

  Read the stylesheets of a public site and return a full DESIGN.md: semantic roles with the token each came from, measured WCAG contrast pairs, the tokens the site itself declares (framework internals counted separately), font families, the type scale with the ratio between steps,

• decode_site

  Read a sample of pages from one site (from its sitemap.xml, or the homepage links when there is no sitemap) and report what is CONSISTENT across them: which declared tokens, colours, font stacks, radii and spacing values appear on every page read, and which appear on only some. O

• verify_design_md

  Every DESIGN.md carries a Fingerprint line. Pass the id and that fingerprint; the server answers whether the copy matches the current token set, and if not, returns the current tokens so the agent can update the file instead of following a stale one. Call this at the start of a s

• get_scene_embed

  Returns paste-ready code for a CSS Crème Scene: an interactive 3D meadow (four seasons, dandelion clocks, or a garden of peonies, white roses, lilies, irises, hydrangeas, tulips or daffodils, at any hour) grown by code in the browser, with no models or images to load. Give it the

기본 점검i

누구나 볼 수 있는 정보를 점검했고, 코드는 읽지 않았어요. 해당하지 않는 항목은 개수에서 뺐어요. · 2026년 11월 12일 점검

• ✓ 통과

  제작자와 저장소 일치

  레지스트리 이름이 도메인 csscreme.com 기준으로 확인되었어요(레지스트리가 도메인 소유를 확인해요)

• ✓ 통과

  계속 관리되고 있음

  코드 마지막 변경: 20일 전

• ✓ 통과

  라이선스 있음

  MIT 사용

• ✓ 통과

  엔드포인트 응답

  461ms 만에 응답(HTTP 200)

• – 해당 없음

  OAuth로 로그인

  로그인 필요 없음

• ✓ 통과

  도구 설명에 숨겨진 지시 없음

  도구 설명 13개를 읽었고, AI에게 보내는 숨겨진 지시는 없었어요

사용자 리뷰

아직 리뷰가 없어요

Google로 로그인하고 리뷰 쓰기

디자인, 이미지 및 오디오 카테고리의 다른 서버와 비교i

• 이 카테고리의 다른 서버 2951개 중 0%보다 스타가 많아요
• 이 카테고리의 다른 서버 2951개 중 35%보다 최근에 레지스트리에 공개됐어요
• 기본 점검 결과가 이 카테고리의 다른 서버 2951개 중 100%와 같거나 더 좋아요

레지스트리에서 이 카테고리의 활성 서버 전체와 비교했어요. 스타는 게시자가 저장소를 소유한 경우에만 세요.

같은 카테고리의 다른 것

같은 카테고리에서 다른 제작자가 만든 서버예요. 스타 순으로 정렬했어요.

카드 보는 법:↓ 주간 다운로드i★ GitHub 스타i세 기둥: 리뷰 · 점검 · 사용 정도i업데이트 = 최신 버전을 레지스트리에 공개한 날i

Figma Context MCP

Give your coding agent access to your Figma data. Implement designs in any framework in one-shot.

제작자: GLips·널리 사용됨·↓ 15.2만/주·★ 1.6만·5개월 전 업데이트

내 컴퓨터에서 실행

설치

AutoClip

Clip long videos into short clips with covers and captions. Local CLI and MCP.

제작자: zhouxiaoka·널리 사용됨·↓ 205/주·★ 1만·15일 전 업데이트

내 컴퓨터에서 실행

설치

Next AI Draw.io

draw.io diagrams your AI agent draws on a live browser canvas that you can also edit by hand

제작자: DayuanJiang·널리 사용됨·↓ 2.2만/주·★ 3.7만 저장소 전체의 별·5일 전 업데이트

내 컴퓨터에서 실행

설치

제작자의 README

claude mcp add --transport http csscreme https://csscreme.com/mcp

mkdir -p .claude/skills/csscreme