AIエージェントスキル
UIデザイン、レスポンシブレイアウト、タイポグラフィ、フロントエンド開発向けのAIエージェントスキルを探しましょう。次のサイトのための再利用可能な手順を見つけ、ログインしてスキルを読み、インストール用プロンプトをエージェントにコピーできます。
スキルを読み込み中…
Create a minimal agency design system with a disciplined editorial grid, oversized typography, quiet uppercase utility labels, restrained image blocks, and subtle structural detail.
Add a restrained particle atmosphere inside one section with configurable shapes, density, gravity, wind, sway, rotation, recycling or settling, pointer disturbance, visibility pausing, responsive limits, and reduced-motion fallbacks. Use for petals, leaves, snow, sparks, confetti, dots, paper, icons, or brand fragments that support a section's mood without obscuring content.
Create an on-scroll animation trigger using IntersectionObserver with Tailwind-friendly animation classes and keyframes. Use when asked for scroll-reveal, animate-on-scroll, or sequencing element animations when they enter the viewport.
Guides designing and implementing tasteful, high-performance product-grade web animation systems inspired by Stripe, Linear, Apple, and Vercel.
Master Apple's principles for fluid interfaces, physical motion, and tactile UI through springs, interruption, and spatial consistency on the web.
Create a dark atmospheric background with drifting vertical light folds, screen-blended glow, and a concentrated luminous corner or lower-edge bloom.
Guides using Aura’s asset library to source Unsplash-style images plus recommended crops and resolutions for design and marketing use.
Create a perspective WebGL background grid with fading lines, subtle particle haze, slow forward drift, and gentle camera parallax.
Enforces opinionated UI standards for typography, spacing, performance, and accessibility to eliminate AI-generated interface slop.
Apply exact Tailwind arbitrary shadow utilities for polished, layered neutral elevation across cards, controls, and modals.
Create a clean modern design system with a luminous blue sky atmosphere, soft drifting cloud light, minimal white framing, and serene premium typography.
Create a clean dark glass layout system with a thin blue laser atmosphere, frosted premium shells, and polished dashboard structure.
Create an archival book-reader design system with serif-led pages, mono index navigation, aged paper surfaces, margin notes, and a premium catalog frame.
Create a bright-green technical design system with structured split layouts, hard-framed dark surfaces, mono utility labels, and a prominent WebGL visualization zone.
Create premium cinematic web motion systems with GSAP, ScrollTrigger, and Lenis. Use for luxury editorial websites, creative studio portfolios, Awwwards-style interactions, smooth scroll reveals, staggered text, parallax, pinned sections, magnetic hover states, custom cursors, and mouse-reactive layered movement.
Create cinematic scroll-driven landing pages with Lenis smooth scrolling, GSAP ScrollTrigger, scroll-linked progression, staggered text reveals, sticky card stacks, parallax backgrounds, scroll-scrubbed transitions, footer reveals, and immersive preloaders. Use when analyzing or building premium editorial scroll experiences, sticky project stacks, kinetic typography, or section-by-section storytelling.
Create a clean minimal beige light-mode design system with warm neutral shells, quiet process grids, restrained accent color, and elegant low-contrast structure.
Implement a lightweight interactive WebGL globe with cobe.js, including responsive canvas setup, markers, interaction, and React/Next.js integration.
Add vertical container-size guide lines and mini corner squares for precise, structured web layouts using CSS.
Expert conversion copywriting guidelines for creating clear, compelling marketing copy that drives action across landing pages, homepages, and product features.
Guidelines and workflows for writing high-converting marketing copy for web pages, including headlines, CTAs, and page structures.
Implement precise chamfered edges and diagonal-cut corners for buttons and containers using CSS clip-path and polygon shapes.
Create a corner-anchored laser composition with thin beams, a bright emitter node, bloom, and atmospheric glow or fog.
より良いAIデザインのワークフローを作る
エージェントスキルは、特定のタスク向けの再利用可能な手順セットです。UIデザインスキルは、レイアウト、余白、タイポグラフィ、視覚的な一貫性を導きます。フロントエンドスキルは、その方向性をレスポンシブなインターフェースに落とし込みます。プロジェクトとコーディングエージェントの能力に合う手順を選んでください。
スキルの使い方
ライブラリを閲覧するか、デザインのタスクを検索します。スキルを開き、ログインして手順を読み、「エージェント用にコピー」でインストール用プロンプトを用意します。エージェントにインストールを依頼する前に、詳細ページでオリジナルの GitHub ソースを確認してください。互換性とインストール手順はスキルによって異なります。
完成されたビジュアルの出発点をお探しですか?こちらの ウェブサイトテンプレートとUIデザインプロンプト を見るか、 プロンプトパックとメンバーシップ.