UI/UX, 로고, 슬라이드, 이미지 생성 (7.4천건)
Create distinctive, production-grade frontend interfaces with high design quality. Use this skill when the user asks to build web components, pages, artifacts, posters, or applications (examples include websites, landing pages, dashboards, React components, HTML/CSS layouts, or when styling/beautifying any web UI). Generates creative, polished code and UI design that avoids generic AI aesthetics.
한국어 요약은 준비 중입니다. 원문 설명을 표시하고 있습니다.
Comprehensive integration skill for building sites with SvelteKit 2, Svelte 5, and Tailwind CSS v4
한국어 요약은 준비 중입니다. 원문 설명을 표시하고 있습니다.
Polishes UI primitives one at a time using 2026 research-backed patterns — adds loading/icon states to buttons, replaces inline skeletons with primitives, adds secondary actions to errors, ensures 48px touch targets and visible focus indicators, applies a standard motion token ladder. Use when: 'make the UI feel more polished', 'add attention to detail', 'reduce component duplication', 'tighten the design system', 'apply craft to the frontend'.
한국어 요약은 준비 중입니다. 원문 설명을 표시하고 있습니다.
UE (user experience engineering) skill for defining end-to-end user experience behavior and interaction logic. Use for tasks like flow design, interaction models, state machines, error recovery, input validation, usability heuristics, accessibility, and turning UX intent into testable acceptance criteria for implementation.
한국어 요약은 준비 중입니다. 원문 설명을 표시하고 있습니다.
Implement complete dark mode for any frontend project. Auto-detects theme system (Flutter ThemeData, Tailwind dark class, CSS variables, MUI, Chakra UI, styled-components), generates a dark color palette with proper surface elevation hierarchy and desaturated brand colors, creates a theme toggle with system preference detection and persistence, migrates all hardcoded colors to theme tokens, handles special cases like images, shadows, form inputs, and charts, then verifies WCAG AA contrast ratios for both modes. Use when you need to add dark mode, fix dark theme contrast issues, create a theme switcher, or migrate hardcoded colors to theme-aware tokens.
한국어 요약은 준비 중입니다. 원문 설명을 표시하고 있습니다.
Use this skill whenever the user asks for an HTML-first visual design deliverable or design judgment: interactive prototype, slide deck, motion demo, infographic, dashboard, landing page, whitepaper, changelog, business card, social cover, brand system, design critique, multi-variant exploration, or export to MP4, GIF, PPTX, PDF, or SVG. It is optimized to make AI agents do the routing, template selection, verification, and export prep so humans spend less time prompt-engineering. Do not use for production web apps, SEO sites, backend systems, or pure copy edits.
한국어 요약은 준비 중입니다. 원문 설명을 표시하고 있습니다.
Establish a naming convention system for design elements, components, and tokens with clear rules and examples.
한국어 요약은 준비 중입니다. 원문 설명을 표시하고 있습니다.
Use Grok 4.5 as the required external design advisor when a task needs UI critique, UX critique, component-choice review, interaction-flow review, design imagery markdown, art direction, visual hierarchy judgment, design-system fit, color/type/layout suggestions, HTML mockups, SVG icons, handwritten SVG wordmarks, or file-based feedback on existing UI. Trigger on requests like "design a page", "generate design imagery", "give design advice", "optimize this UI", "improve UX", "optimize user flow", "review interaction", "check usability", "reduce friction", "choose the right component", "review this design", "create an icon", "suggest colors", "UI mockup", "visual direction", "lettering", "wordmark", "handwritten logo", or when another agent needs a second opinion on visual or interaction quality.
한국어 요약은 준비 중입니다. 원문 설명을 표시하고 있습니다.
Architecture-first UI/UX design skill for Codex that helps agents reason from product truth, user journeys, causal design decisions, art direction, interaction, responsive behavior, imagery, iconography, and motion before implementation, then validate the result through rendered browser critique.
한국어 요약은 준비 중입니다. 원문 설명을 표시하고 있습니다.
Define a set of actionable design principles that guide decision-making and resolve trade-offs.
한국어 요약은 준비 중입니다. 원문 설명을 표시하고 있습니다.
An engineering-grade marketing system organized around two surface modes — a deep black canvas for hero and footer chapters and a flat paper-white canvas for body content — connected by a single, almost violently saturated NVIDIA Green accent that carries every CTA, every active tab, and the small decorative corner squares that mark out cards. The system is unapologetically angular: 2px radius across every surface, tight bold sans-serif typography in NVIDIA's proprietary EMEA cut, and a hairline gray rule that separates dense multi-column technical content. There is no decorative gradient, no atmospheric mesh, no soft drop shadow — just black, white, gray, and green stacked into a structured editorial grid that scales from product cards to massive industry landing pages without bending its rules.
한국어 요약은 준비 중입니다. 원문 설명을 표시하고 있습니다.
Miro presents itself as the AI-powered visual workspace through a confident, almost playful brand voice — anchored by its signature canary yellow ({colors.brand-yellow}) wordmark over white canvas, broken open by colorful pastel feature tints (rose, teal, coral, orange, mint) that echo the actual sticky-note color palette used on the live whiteboard. Black-pill primary buttons dominate marketing, real Miro-board mockups serve as feature illustrations, and a 4-tier pricing grid leads into a dense comparison table. Roobert PRO carries display headlines; the system supports homepage, pricing, AI Workflows product page, agile vertical, and customer stories surfaces.
한국어 요약은 준비 중입니다. 원문 설명을 표시하고 있습니다.
极简产品预发布落地页, 含邮箱捕获、logo、装饰图层
한국어 요약은 준비 중입니다. 원문 설명을 표시하고 있습니다.
Comprehensive design skill: brand identity, design tokens, UI styling, logo generation (55 styles, Gemini 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.
한국어 요약은 준비 중입니다. 원문 설명을 표시하고 있습니다.
Web 视觉设计 SKILL。输入 PRD / 参考 URL / 截图 / 关键词（任意组合），先产出一份标准化 DESIGN.md 设计规范，用户确认后据此生成 UI/UX、视觉、动效、响应式全部达标的 web 代码。专攻 web 端：Landing Page、Portfolio、产品页、博客、个人站、SaaS 介绍页等。当用户说"帮我做个网站""设计一个页面""参考 XX 做一个""把这个截图/PRD 做成网页""做一个 landing page""出一份 design 规范"时触发。不用于后端、数据库、纯逻辑 bug 修复。
한국어 요약은 준비 중입니다. 원문 설명을 표시하고 있습니다.
Bidirectional Figma skill — read designs and write back to Figma. READ: extract tokens, map Vue/Reka UI components, translate Auto Layout to Tailwind. WRITE: push components, screens, and design tokens from code to Figma. Requires /figma:figma-use skill before every use_figma call.
한국어 요약은 준비 중입니다. 원문 설명을 표시하고 있습니다.
Maxim Master Design Intelligence — full-spectrum UI/UX orchestration. Activates all design sub-domain skills in parallel. Use when a task spans multiple design domains simultaneously: product design strategy, interaction design, information architecture, usability heuristics, design critique, cross-platform consistency, design leadership. The master conductor of all Maxim design agents.
한국어 요약은 준비 중입니다. 원문 설명을 표시하고 있습니다.
Design one-off HTML artifacts (landing, deck, prototype).
한국어 요약은 준비 중입니다. 원문 설명을 표시하고 있습니다.
Define and organize design tokens (color, spacing, typography, elevation) with naming conventions and usage guidance.
한국어 요약은 준비 중입니다. 원문 설명을 표시하고 있습니다.
Add strategic color to monochromatic or dull interfaces using oklch for perceptually uniform palettes. Generates harmonious color systems with automatic light/dark variants and accessible contrast ratios.
한국어 요약은 준비 중입니다. 원문 설명을 표시하고 있습니다.
A clean, calendar-software-first interface anchored on white canvas with black primary CTAs and custom Cal Sans display typography. The system reads as friendly modern SaaS — generous whitespace, soft-rounded cards (~12px), product UI fragments shown directly inside cards, and a dark navy footer that visually closes long-scroll pages. Brand voltage comes from the Cal Sans display headline (a custom geometric face) and from product UI artifacts shown in-card rather than from accent colors.
한국어 요약은 준비 중입니다. 원문 설명을 표시하고 있습니다.
Production-ready CSS transitions for web apps. Use when implementing notification badges, dropdowns, modals, panel reveals, page transitions, card resizes, number pop-ins, text swaps, icon swaps, success checks, avatar group hovers, error state shakes, search/input clear, skeleton loaders, shimmer text, sliding tabs, tooltips, staggered text reveals, card hover tilt, plus-to-menu morph, or accordions. Triggers on "add a transition", "animate the dropdown", "make the modal open smoothly", "swap icon", "page slide", "stagger animation", "open / close transition", "make it animate", "fade between", "success animation", "form error", "shake on invalid", "hover lift", "avatar stack hover", "clear the search", "skeleton loader", "loading shimmer", "shimmer text", "sliding tabs", "segmented control", "tooltip", "reveal text", "tilt card", "3D hover tilt", "cursor glare", "plus to menu", "FAB morph", "accordion", "collapsible", "expand / collapse", "disclosure". Also "motion tokens", "scan for ad-hoc transitions", "replace hardcoded durations with motion tokens", "tokenize my animations", and the commands transitions reveal, transitions review, transitions apply, transitions refine.
한국어 요약은 준비 중입니다. 원문 설명을 표시하고 있습니다.
Propose a new change with all artifacts generated in one step. Use when the user wants to quickly describe what they want to build and get a complete proposal with design, specs, and tasks ready for implementation.
한국어 요약은 준비 중입니다. 원문 설명을 표시하고 있습니다.
UI/UX design system and component patterns for OpenFoodJournal. Use when building new views, adding UI components, styling elements, presenting sheets, or modifying any view file. Contains the project's design tokens, component catalog, animation conventions, and layout patterns so new UI stays visually consistent with the existing app.
한국어 요약은 준비 중입니다. 원문 설명을 표시하고 있습니다.