Communitygithub.com

nextlevelbuilder/ui-ux-pro-max

Web/モバイル向けのUI/UXデザインインテリジェンス。50以上のスタイル、161のカラーパレット、57のフォントペアリング、161のプロダクトタイプ、99のUXガイドライン、25のチャートタイプを10スタック(React、Next.js、Vue、Svelte、SwiftUI、React Native、Flutter、Tailwind、shadcn/ui、HTML/CSS)で提供。

ui-ux-pro-max とは?

このスキルは、AIエージェントがUI/UXデザインと実装を高度に支援するための包括的なナレッジベースです。50以上のデザインスタイルや161のカラーパレット、57のフォントペアリング、99のUXガイドラインなど、膨大なデザイン資産を備えており、WebおよびモバイルアプリケーションのUI開発を加速します。React、Next.js、Vue、Svelte、SwiftUI、React Native、Flutter、Tailwind、shadcn/ui、HTML/CSSといった主要なフロントエンドスタックをカバーし、ボタン、モーダル、ナビバー、サイドバー、カード、テーブル、フォーム、チャートなどのUI要素に対する具体的なデザイン判断やコード生成を可能にします。さらに、shadcn/ui MCPとの統合により、実際のコンポーネント例を検索しながら実装できるため、開発者はデザインシステムに沿った高品質なUIを効率的に構築できます。

対応~Claude Code~Codex CLI~Cursor
npx skills add https://github.com/nextlevelbuilder/ui-ux-pro-max-skill/tree/main/skills/ui-ux-pro-max

お気に入りのAIに質問する

このエージェントスキルを事前に読み込んだ状態で新しいチャットを開きます。

ドキュメント

ui-ux-pro-max は何をしますか?

Webおよびモバイル向けのUI/UXデザインインテリジェンス。50以上のスタイル、161のカラーパレット、57のフォントペアリング、161のプロダクトタイプ、99のUXガイドライン、25のチャートタイプを10スタック(React、Next.js、Vue、Svelte、SwiftUI、React Native、Flutter、Tailwind、shadcn/ui、およびHTML/CSS)で提供します。アクション: 計画、構築、作成、設計、実装、レビュー、修正、改善、最適化、拡張、リファクタリング、UI/UXコードのチェック。プロジェクト: ウェブサイト、ランディングページ、ダッシュボード、管理パネル、eコマース、SaaS、ポートフォリオ、ブログ、モバイルアプリ。要素: ボタン、モーダル、ナビバー、サイドバー、カード、テーブル、フォーム、チャート。スタイル: グラスモーフィズム、クレイモーフィズム、ミニマリズム、ブルータリズム、ニューモーフィズム、ベントーグリッド、ダークモード、レスポンシブ、スキューモーフィズム、フラットデザイン。トピック: カラーシステム、アクセシビリティ、アニメーション、レイアウト、タイポグラフィ、フォントペアリング、スペーシング、インタラクション状態、シャドウ、グラデーション。統合: コンポーネント検索と例のためのshadcn/ui MCP。

Individual skills in this repo

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

banner-design

Design banners for social media, ads, website heroes, creative assets, and print. Multiple art direction options with optional generated or supplied visuals. Actions: design, create, generate banner. Platforms: Facebook, Twitter/X, LinkedIn, YouTube, Instagram, Google Display, website hero, print. Styles: minimalist, gradient, bold typography, photo-based, illustrated, geometric, retro, glassmorphism, 3D, neon, duotone, editorial, collage.

brand

Brand voice, visual identity, messaging frameworks, asset management, brand consistency. Activate for branded content, tone of voice, marketing assets, brand compliance, style guides.

design

Comprehensive design skill: brand identity, design tokens, UI styling, logo generation (55 styles, Gemini, Atlas Cloud, or MuAPI AI), corporate identity program (50 deliverables, CIP mockups), HTML presentations (Chart.js), banner design (22 styles, social/ads/web/print), icon design (15 styles, SVG, Gemini 3.1 Pro), social photos (HTML→screenshot, multi-platform). Actions: design logo, create CIP, generate mockups, build slides, design banner, generate icon, create social photos, social media images, brand identity, design system. Platforms: Facebook, Twitter, LinkedIn, YouTube, Instagram, Pinterest, TikTok, Threads, Google Ads.

design-system

Token architecture, component specifications, and slide generation. Three-layer tokens (primitive→semantic→component), CSS variables, spacing/typography scales, component specs, strategic slide creation. Use for design tokens, systematic design, brand-compliant presentations.

slides

Create strategic HTML presentations with Chart.js, design tokens, responsive layouts, copywriting formulas, and contextual slide strategies.

ui-styling

Create beautiful, accessible user interfaces with shadcn/ui components (built on Radix UI + Tailwind), Tailwind CSS utility-first styling, and canvas-based visual designs. Use when building user interfaces, implementing design systems, creating responsive layouts, adding accessible components (dialogs, dropdowns, forms, tables), customizing themes and colors, implementing dark mode, generating visual designs and posters, or establishing consistent styling patterns across applications.

ui-ux-pro-max

UI/UX design intelligence for web, mobile, and desktop. This skill should be used when designing, building, reviewing, or fixing interfaces, including pages, components, design systems, accessibility, interaction, responsive layout, typography, color, charts, and stack-specific UI implementation. Searchable local data: 80 searchable styles (51 active), 192 product palettes and reasoning profiles, 74 font pairings, 119 UX guidelines, 105 icons, 17 GSAP presets, 25 chart types, and 22 stacks.

関連スキル