AI agent skills for front-end teams and web designers

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

Elroy Yeap

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

656 views

8 Uses

Added by kostja zhang

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

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

Create a high-performance full-screen WebGL laser background with an atmospheric smoke effect and brand-integrated glowing cores.

A comprehensive art direction system for generating high-end, implementation-friendly website design references with an emphasis on hierarchy, imagery, and anti-slop visual discipline.

Expert guidelines for modern UI design covering layout, theme, color systems with oklch(), and accessibility for responsive web development.

Robert Denton

Create a premium 3D particle globe with a luminous spherical core and orbital rings using Three.js and custom shaders.

A framework of portable agent skills to upgrade AI-built interfaces with high-end typography, motion, and layout instead of boilerplate code.

159 views

10 Uses

Added by Ivan Oung

Aura is an AI-powered landing page builder that enables users to create stunning designs and export them to HTML and Figma without design skills.

Lon Obers

aura.build

A comprehensive guide to designing and writing high-converting landing pages for SaaS and services using proven structures, copywriting formulas, and conversion strategies.

151 views

1 Uses

Added by JDC GLOBAL

Create a premium, futuristic dark-blue design system with procedural mesh gradients, hero shells, and minimal UI nodes.

Create atmospheric monochrome procedural backgrounds with enlarged square pixels and visible Bayer-style ordered dithering.

Create high-quality 3D hero objects with geometric mesh depth, physically based materials, and real-time lighting using WebGL and Three.js.

111 views

1 Uses

Added by JDC GLOBAL

A comprehensive guide for building distinctive, production-grade frontend interfaces with unique aesthetics, refined typography, and high-impact motion.

109 views

3 Uses

Added by hill

Create minimal, editorial web layouts using thin boundary lines, L-shaped corner brackets, and strict grid-based section alignment.

Learn to implement keyframe animations, skeletal rigs, morph targets, and procedural motion in Three.js environments.

86 views

1 Uses

Added by JDC GLOBAL

Master Three.js animation systems including keyframes, mixers, skeletal animation, and morph targets for 3D web experiences.

80 views

Added by Colsls

Expert conversion copywriting guidelines for creating clear, compelling marketing copy that drives action across landing pages, homepages, and product features.

71 views

5 Uses

Added by Lon Obers

Add vertical container-size guide lines and mini corner squares for precise, structured web layouts using CSS.

Learn to implement keyframe animations, skeletal rigs, morph targets, and advanced animation blending techniques in Three.js.

58 views

1 Uses

Added by Lon Obers

A comprehensive toolkit for building responsive, mobile-first web applications using Bootstrap 5's layout system, components, and utility classes.

furqan zamir

Implement modern responsive layouts using container queries, fluid typography, CSS Grid, and mobile-first breakpoint strategies for adaptive interfaces.

46 views

Added by Colsls

An advanced frontend engineering protocol for building high-contrast, editorial-style interfaces with warm monochrome palettes and bento-grid layouts.

bill Cipher