Aura Skills

AI agent skills for front-end teams and web designers

A curated library of reusable skills, automation templates, and instructions tailored to front-end teams, web designers, and creative developers. Use agent skills in Aura by referencing @ in your prompt.

Library Pulse

42skills
Updated Mar 20, 2026
Showing 42 of 42 skills

UI Design System

Toolkit for creating and maintaining scalable UI design systems with tokens, responsive rules, accessibility and developer handoff docs.

5.8k views
685 Uses
Meng ToAdded by Meng To
davila7davila7
davila7/claude-code-templates

Copywriting

Guidelines and workflows for writing high-converting marketing copy for web pages, including headlines, CTAs, and page structures.

3.3k views
295 Uses
Meng ToAdded by Meng To
coreyhaines31coreyhaines31
coreyhaines31/marketingskills

Tailwind Design System v4

Build scalable, responsive, and accessible design systems with Tailwind CSS v4, design tokens, and reusable React UI components.

3.2k views
227 Uses
Meng ToAdded by Meng To
wshobsonwshobson
wshobson/agents

Three.js Animation

Guide to creating, controlling, and optimizing animations in Three.js, including keyframes, skeletal rigs, morph targets, blending, and procedural motion.

3k views
251 Uses
Meng ToAdded by Meng To
CloudAI-XCloudAI-X
CloudAI-X/threejs-skills

Web Interface Guidelines

Checklist for reviewing UI code for compliance with comprehensive web interface, accessibility, performance, and content guidelines.

2.9k views
174 Uses
Meng ToAdded by Meng To
vercel-labsvercel-labs
vercel-labs/web-interface-guidelines

Marketing Psychology & Mental Models

Applies psychological principles and mental models to design ethical, effective marketing, pricing, and growth strategies.

2.6k views
191 Uses
Meng ToAdded by Meng To
coreyhaines31coreyhaines31
coreyhaines31/marketingskills

Analytics Tracking

Guide for planning, implementing, and validating analytics tracking with GA4, GTM, and UTM strategies.

2.6k views
47 Uses
Meng ToAdded by Meng To
coreyhaines31coreyhaines31
coreyhaines31/marketingskills

Interaction Design

Design and implement purposeful UI motion, microinteractions, and feedback patterns to enhance usability and user delight.

1.8k views
237 Uses
Meng ToAdded by Meng To
wshobsonwshobson
wshobson/agents

Landing Page High-Conversion Web Design

Guidelines and workflows for designing and writing high-converting SaaS and service landing pages, covering structure, layout, copy, and SEO/AEO.

1.6k views
145 Uses
Meng ToAdded by Meng To
MengToMengTo
MengTo/Skills

Frontend Design for Distinctive Interfaces

Guides creation of distinctive, production-grade frontend interfaces with bold, cohesive aesthetics and refined implementation.

1.4k views
138 Uses
Meng ToAdded by Meng To
anthropicsanthropics
anthropics/skills

Web Design Reviewer

Inspects web interfaces for layout, responsive, accessibility, and visual issues, then applies targeted source code fixes and re-verifies results.

1.2k views
58 Uses
Meng ToAdded by Meng To
githubgithub
github/awesome-copilot

GSAP Web Animation Skill

Guide to implementing and debugging professional GSAP-based web animations, timelines, and ScrollTrigger interactions.

1.1k views
124 Uses
Meng ToAdded by Meng To
MengToMengTo
MengTo/Skills

Anime.js v4 Skill

Comprehensive guide to using Anime.js v4 for JavaScript-driven web animations, timelines, SVG, scroll effects, and draggable interactions.

1.1k views
58 Uses
Meng ToAdded by Meng To
BowTiedSwanBowTiedSwan
BowTiedSwan/animejs-skills

Vanta.js Animated WebGL Backgrounds Skill

Guide to setting up, configuring, and integrating Vanta.js animated WebGL backgrounds, including React usage, resizing, and performance considerations.

751 views
29 Uses
Meng ToAdded by Meng To
MengToMengTo
MengTo/Skills

Animation Systems for Product-Grade Web Motion

Guides designing and implementing tasteful, high-performance product-grade web animation systems inspired by Stripe, Linear, Apple, and Vercel.

723 views
65 Uses
Meng ToAdded by Meng To
MengToMengTo
MengTo/Skills

Aura Asset Images for Design Mockups

Guides using Aura’s asset library to source Unsplash-style images plus recommended crops and resolutions for design and marketing use.

656 views
38 Uses
Meng ToAdded by Meng To
MengToMengTo
MengTo/Skills

CSS Border Gradient Skill

Teach how to create and customize CSS gradient borders using a pseudo-element mask, including Tailwind-friendly usage and common pitfalls.

635 views
19 Uses
Meng ToAdded by Meng To
MengToMengTo
MengTo/Skills

Progressive Blur Skill

Implement layered CSS progressive blur overlays at the top or bottom of the viewport using multiple masked backdrop-filter layers.

623 views
21 Uses
Meng ToAdded by Meng To
MengToMengTo
MengTo/Skills

High-Conversion SaaS Pricing Page Design

Framework and checklists for designing and writing a high-converting SaaS pricing page, including layout patterns, copy, FAQs, and SEO/AEO.

587 views
20 Uses
Meng ToAdded by Meng To
MengToMengTo
MengTo/Skills

cobe.js Lightweight WebGL Globe Skill

Implement a lightweight interactive WebGL globe with cobe.js, including responsive canvas setup, markers, interaction, and React/Next.js integration.

533 views
16 Uses
Meng ToAdded by Meng To
MengToMengTo
MengTo/Skills

Responsive Design

Master modern responsive design techniques using container queries, fluid typography, CSS Grid, and mobile-first strategies for adaptive interfaces.

471 views
55 Uses
Added by Aura community
wshobsonwshobson
wshobson/agents

Matter.js Skill

Guidelines and patterns for setting up Matter.js 2D physics scenes, interactions, and cleanup in web environments.

468 views
19 Uses
Meng ToAdded by Meng To
MengToMengTo
MengTo/Skills

CSS Alpha Masking Skill

Apply CSS linear-gradient-based alpha masks for horizontal or vertical edge fades using mask-image and -webkit-mask-image.

459 views
23 Uses
Meng ToAdded by Meng To
MengToMengTo
MengTo/Skills

Unsplash Asset Images for Avatars and Backgrounds

Guidelines and curated Unsplash picks for avatars, portraits, backgrounds, and wallpapers with correct sizes and aspect ratios.

424 views
18 Uses
Meng ToAdded by Meng To
MengToMengTo
MengTo/Skills

Canvas Design

Guides creating original visual design philosophies and expressing them as meticulously crafted, museum-quality PNG or PDF art with minimal text.

370 views
16 Uses
Added by Aura community
anthropicsanthropics
anthropics/skills

Three.js Animation

Skill guide for creating and controlling animations in Three.js, including keyframes, skeletal rigs, morph targets, blending, and procedural motion.

321 views
9 Uses
Nigel AlbaAdded by Nigel Alba
CloudAI-XCloudAI-X
CloudAI-X/threejs-skills

GSAP React Installation

Provides npm commands to install GSAP and its React integration package.

275 views
14 Uses
Saadat MyrzabekSaadat Myrzabek

shadcn

How to install shadcn/ui, set up dependencies, and structure your React app across multiple frameworks.

266 views
23 Uses
Arsal IdreesArsal Idrees
ui.shadcn.com

Progressive Blur UI Overlay

Implement a customizable progressive gradient blur overlay at the top or bottom of the viewport using layered CSS backdrop-filters.

249 views
5 Uses
Aura community

Image Optimization Analysis

Analyze and optimize webpage images for SEO, performance, formats, responsiveness, lazy loading, and CLS prevention.

172 views
3 Uses
Jorge JaramilloAdded by Jorge Jaramillo
jorgejaramillojorgejaramillo
jorgejaramillo/seoskills

Branding Strategies

Defines and structures brand strategy, storytelling, voice, and visual identity for consistent branding across touchpoints.

171 views
19 Uses
Added by Aura community
kostja94kostja94
kostja94/marketing-skills

Features Page Generator

Guides the planning, copy, structure, and SEO of high-converting product features pages.

149 views
3 Uses
Added by Aura community
kostja94kostja94
kostja94/marketing-skills

GEO (Generative Engine Optimization) Strategies

Guides generative engine optimization strategies to improve content visibility and citation in AI search answers across tools like ChatGPT, Perplexity, and AI Overviews.

149 views
7 Uses
Added by Aura community
kostja94kostja94
kostja94/marketing-skills

Advanced UI Prompt Architect

Generates structured prompts for creating professional SaaS interfaces, landing pages, and dashboards with clear layout, components, and visual design rules.

141 views
5 Uses
Sourasith PhomhomeSourasith Phomhome

Cold Start Strategies

Guides cold start strategy for AI/SaaS products to get first users, traction, and validate product-market fit from zero.

126 views
1 Uses
Added by Aura community
kostja94kostja94
kostja94/marketing-skills

SaaS Light Mode Designer

Guides the design of premium light-mode SaaS marketing pages with editorial grids, restrained color, framing lines, subtle motion, and conversion-focused layouts.

103 views
12 Uses
Sourasith PhomhomeSourasith Phomhome

Structured SaaS Interface System

Guidelines for designing a polished SaaS marketing interface with strong layout systems, realistic product dashboards, subtle motion, and refined visual hierarchy.

90 views
11 Uses
Sourasith PhomhomeSourasith Phomhome

Algorithmic Art

Create generative art with p5.js using seeded randomness, noise, flow fields, particle systems, recursive forms, and palette-based experimentation.

85 views
1 Uses
Added by Aura community
MoizIbnYousafMoizIbnYousaf
MoizIbnYousaf/Ai-Agent-Skills

Advanced Light SaaS UI System

Guides creation of polished light-mode SaaS marketing interfaces with varied layouts, rich product UI components, strong hierarchy, and subtle motion.

83 views
8 Uses
Sourasith PhomhomeSourasith Phomhome

Skill Creator

Guidance for creating, structuring, editing, packaging, and iterating reusable Claude skills with metadata, resources, and best practices.

83 views
Added by Aura community
ComposioHQComposioHQ
ComposioHQ/awesome-claude-skills

Artifacts Builder

Builds complex single-file Claude artifacts with React, TypeScript, Tailwind CSS, and shadcn/ui using init and bundling scripts.

75 views
2 Uses
Added by Aura community
CommandCodeAICommandCodeAI
CommandCodeAI/agent-skills

Internal Communications

Guides writing internal company communications like status reports, leadership updates, newsletters, FAQs, and incident reports using preferred formats.

66 views
1 Uses
Added by Aura community
CommandCodeAICommandCodeAI
CommandCodeAI/agent-skills