Communitygithub.com

davila7/ui-ux-pro-max

UI/UX 디자인 인텔리전스. 50가지 스타일, 21가지 팔레트, 50가지 폰트 페어링, 20가지 차트, 9가지 스택(React, Next.js, Vue, Svelte, SwiftUI, React Native, Flutter, Tailwind, shadcn/ui)을 지원합니다.

ui-ux-pro-max란 무엇인가요?

이 스킬은 AI 에이전트(Claude Code, Cursor, Codex 등)가 UI/UX 디자인을 계획, 생성, 구현, 검토, 최적화할 수 있도록 설계된 포괄적인 지식 베이스입니다. 50가지 디자인 스타일(글래스모피즘, 클레이모피즘, 미니멀리즘, 브루탈리즘, 뉴모피즘, 벤토 그리드, 다크 모드 등), 21가지 컬러 팔레트, 50가지 폰트 페어링, 20가지 차트 유형을 제공하여 다양한 프로젝트(웹사이트, 랜딩 페이지, 대시보드, 관리자 패널, 이커머스, SaaS, 포트폴리오, 블로그, 모바일 앱)에서 활용할 수 있습니다. React, Next.js, Vue, Svelte, SwiftUI, React Native, Flutter, Tailwind, shadcn/ui 등 9가지 주요 기술 스택을 지원하며, shadcn/ui MCP와 통합되어 컴포넌트 검색 및 예제를 제공합니다. 주요 기능으로는 접근성, 애니메이션, 레이아웃, 타이포그래피, 간격, 호버, 그림자, 그라디언트 등 UI/UX 관련 모든 주제를 다루며, plan(계획), build(구축), create(생성), design(디자인), implement(구현), review(리뷰), fix(수정), improve(개선), optimize(최적화), enhance(향상), refactor(리팩토링), check(확인) 액션을 통해 디자인과 코드를 지속적으로 개선할 수 있습니다.

지원 대상~Claude Code~Codex CLI~Cursor
npx skills add https://github.com/davila7/claude-code-templates/tree/main/skills/ui-ux-pro-max
원본 보기→모든 스킬 둘러보기

즐겨 사용하는 AI에게 물어보기

이 에이전트 스킬이 미리 로드된 새 채팅을 엽니다.

OpenAIChatGPTClaudeClaudeGeminiGeminiGrokGrokPerplexityPerplexityDeepSeekDeepSeek

문서

ui-ux-pro-max은(는) 무엇을 하나요?

UI/UX 디자인 인텔리전스. 50가지 스타일, 21가지 팔레트, 50가지 폰트 페어링, 20가지 차트, 9가지 스택(React, Next.js, Vue, Svelte, SwiftUI, React Native, Flutter, Tailwind, shadcn/ui). 액션: 계획, 구축, 생성, 디자인, 구현, 리뷰, 수정, 개선, 최적화, 향상, 리팩토링, UI/UX 코드 확인. 프로젝트: 웹사이트, 랜딩 페이지, 대시보드, 관리자 패널, 이커머스, SaaS, 포트폴리오, 블로그, 모바일 앱, .html, .tsx, .vue, .svelte. 요소: 버튼, 모달, 네비게이션 바, 사이드바, 카드, 테이블, 폼, 차트. 스타일: 글래스모피즘, 클레이모피즘, 미니멀리즘, 브루탈리즘, 뉴모피즘, 벤토 그리드, 다크 모드, 반응형, 스큐어모피즘, 플랫 디자인. 주제: 컬러 팔레트, 접근성, 애니메이션, 레이아웃, 타이포그래피, 폰트 페어링, 간격, 호버, 그림자, 그라디언트. 통합: shadcn/ui MCP를 통한 컴포넌트 검색 및 예제.

Individual skills in this repo

This repo contains 20 individual skills — each has its own dedicated page.

davila7/citation-management

Comprehensive citation management for academic research. Search Google Scholar and PubMed for papers, extract accurate metadata, validate citations, and generate properly formatted BibTeX entries. This skill should be used when you need to find papers, verify citation information, convert DOIs to BibTeX, or ensure reference accuracy in scientific writing.

davila7/claude-code-templates

Balance visual design with ATS compatibility for creative roles. Use when the user is in design, art, writing, marketing creative, or any visual/creative field and needs a resume that looks distinctive but still parses.

davila7/claude-code-templates

Optimize resumes for software engineering, product management, and technical roles. Use when the user mentions software engineer, developer, PM, data scientist, ML, DevOps, or other technical role resumes.

davila7/claude-code-templates

Expert in building portfolios that actually land jobs and clients - not just showing work, but creating memorable experiences. Covers developer portfolios, designer portfolios, creative portfolios, and portfolios that convert visitors into opportunities. Use when: portfolio, personal website, showcase work, developer portfolio, designer portfolio.

davila7/claude-code-templates

Create premium, Awwwards-quality website designs as React (.jsx) components that look like they were built by a top-tier agency charging $50k+ per project. Use this skill whenever the user asks for a website, landing page, portfolio, or web component that should look expensive, premium, luxury, editorial, high-end, or agency-quality. Also trigger when the user mentions Awwwards, FWA, award-winning design, or references brands like Apple, Aesop, Bottega Veneta, Stripe, or any luxury/fashion/design-forward brand. Trigger when the user says things like "make it look professional", "make it look expensive", "I want it to look really good", "high quality design", "not generic", or expresses dissatisfaction with typical AI-generated website aesthetics. Do NOT trigger for dashboards, admin panels, internal tools, or functional UI where aesthetics are secondary to utility — the standard frontend-design skill handles those.

davila7/claude-code-templates

Generates creative domain name ideas for your project and checks availability across multiple TLDs (.com, .io, .dev, .ai, etc.). Saves hours of brainstorming and manual checking.

davila7/claude-code-templates

When the user wants to optimize, improve, or increase conversions on any marketing page — including homepage, landing pages, pricing pages, feature pages, or blog posts. Also use when the user says "CRO," "conversion rate optimization," "this page isn't converting," "improve conversions," or "why isn't this page working." For signup/registration flows, see signup-flow-cro. For post-signup activation, see onboarding-cro. For forms outside of signup, see form-cro. For popups/modals, see popup-cro.

davila7/excel-analysis

Analyze Excel spreadsheets, create pivot tables, generate charts, and perform data analysis. Use when analyzing Excel files, spreadsheets, tabular data, or .xlsx files.

davila7/exploratory-data-analysis

Perform comprehensive exploratory data analysis on scientific data files across 200+ file formats. This skill should be used when analyzing any scientific data file to understand its structure, content, quality, and characteristics. Automatically detects file type and generates detailed markdown reports with format-specific analysis, quality metrics, and downstream analysis recommendations. Covers chemistry, bioinformatics, microscopy, spectroscopy, proteomics, metabolomics, and general scientific data formats.

davila7/generate-image

Generate or edit images using AI models (FLUX, Gemini). Use for general-purpose image generation including photos, illustrations, artwork, visual assets, concept art, and any image that isn't a technical diagram or schematic. For flowcharts, circuits, pathways, and technical diagrams, use the scientific-schematics skill instead.

davila7/jira

Use when the user mentions Jira issues (e.g., "PROJ-123"), asks about tickets, wants to create/view/update issues, check sprint status, or manage their Jira workflow. Triggers on keywords like "jira", "issue", "ticket", "sprint", "backlog", or issue key patterns.

davila7/literature-review

Conduct comprehensive, systematic literature reviews using multiple academic databases (PubMed, arXiv, bioRxiv, Semantic Scholar, etc.). This skill should be used when conducting systematic literature reviews, meta-analyses, research synthesis, or comprehensive literature searches across biomedical, scientific, and technical domains. Creates professionally formatted markdown documents and PDFs with verified citations in multiple citation styles (APA, Nature, Vancouver, etc.).

davila7/marketing-strategy-pmm

Product marketing, positioning, GTM strategy, and competitive intelligence. Includes ICP definition, April Dunford positioning methodology, launch playbooks, competitive battlecards, and international market entry guides. Use when developing positioning, planning product launches, creating messaging, analyzing competitors, entering new markets, enabling sales, or when user mentions product marketing, positioning, GTM, go-to-market, competitive analysis, market entry, or sales enablement.

davila7/market-research-reports

Generate comprehensive market research reports (50+ pages) in the style of top consulting firms (McKinsey, BCG, Gartner). Features professional LaTeX formatting, extensive visual generation with scientific-schematics and generate-image, deep integration with research-lookup for data gathering, and multi-framework strategic analysis including Porter's Five Forces, PESTLE, SWOT, TAM/SAM/SOM, and BCG Matrix.

davila7/markitdown

Convert files and office documents to Markdown. Supports PDF, DOCX, PPTX, XLSX, images (with OCR), audio (with transcription), HTML, CSV, JSON, XML, ZIP, YouTube URLs, EPubs and more.

davila7/mermaid-diagram-specialist

Mermaid diagram specialist for creating flowcharts, sequence diagrams, ERDs, and architecture visualizations

davila7/mobile-design

Mobile-first design thinking and decision-making for iOS and Android apps. Touch interaction, performance patterns, platform conventions. Teaches principles, not fixed values. Use when building React Native, Flutter, or native mobile apps.

davila7/prompt-engineer

Expert in designing effective prompts for LLM-powered applications. Masters prompt structure, context management, output formatting, and prompt evaluation. Use when: prompt engineering, system prompt, few-shot, chain of thought, prompt design.

davila7/remotion

Best practices and comprehensive guide for Remotion - programmatic video creation in React with animations, compositions, and media handling

davila7/scientific-slides

Build slide decks and presentations for research talks. Use this for making PowerPoint slides, conference presentations, seminar talks, research presentations, thesis defense slides, or any scientific talk. Provides slide structure, design templates, timing guidance, and visual validation. Works with PowerPoint and LaTeX Beamer.

관련 스킬

steipete/video-frames

Extract frames or short clips from videos using ffmpeg.

community

steipete/summarize

Summarize or transcribe URLs, YouTube/videos, podcasts, articles, transcripts, PDFs, and local files.

community

openclaw/openclaw

Use when testing, fixing, or extending the OpenClaw Control UI GUI with Vitest + Playwright end-to-end checks, mocked Gateway WebSocket flows, mocked dashboard runs, screenshots/videos, or agent-verifiable browser proof.

community

obra/superpowers

Obra superpowers agent skills.

community

affaan-m/ECC

See, Understand, Act on video and audio. See- ingest from local files, URLs, RTSP/live feeds, or live record desktop; return realtime context and playable stream links. Understand- extract frames, build visual/semantic/temporal indexes, and search moments with timestamps and auto-clips. Act- transcode and normalize (codec, fps, resolution, aspect ratio), perform timeline edits (subtitles, text/image overlays, branding, audio overlays, dubbing, translation), generate media assets (image, audio...

community

affaan-m/everything-claude-code

End-to-end marketing campaign planning and execution. Covers audience research, positioning, campaign angle definition, landing page copy, email sequences, social posts, ad copy, short-form video scripts, and content calendars. Use as the orchestration layer for multi-channel product launches. Use when planning or executing a multi-channel product launch, or producing landing page, email, social, or ad copy.

community