UI DESIGN LAB
  • Home
  • Community
  • Library
  • Knowledge
  • Docs
ZHLogin

Groups

All skills723D2Accessibility1Animation6Asset2Component1Design System27Icon2Implementation2Layout6QA1Shadow1Style9Three.js1WebGL11

Most Used

01Work Breakdown Structure Master10.0K02Border Gradients9.9K03Masked Reveal8.9K04Aura Asset Images8.8K05Framed Grid Layout4.8K

Skill Layer

Local expression and techniquesSpecial Skills handle layout, motion, assets, shadows, and local expression. Design Systems now live on their own page.

UI DESIGN LAB Skill Library

Skill LibraryPrompt Skills72 Skills11 Shown

Browse reusable special Prompt Skills.

This library now focuses on local techniques: layout, motion, assets, WebGL, icons, shadows, and component treatments. Page-level Design Systems have their own navigation.

Skill Index

Most-used prompt skills

Ranked by recorded usage so teams can find high-frequency design moves quickly.

01Work Breakdown Structure Master02Border Gradients03Masked Reveal04Aura Asset Images05Framed Grid Layout
67 more skills below
Active Skills72
Groups14
Total Uses59.2K
AccessFree
Library

WebGL

Reset filters
WebGL711 uses

WebGL Laser

Add a focused WebGL laser beam background that uses the design's primary color, with a thin beam, smoky volumetric fog, glow, and a fixed full-screen canvas behind the UI.

Add a focused WebGL laser beam background that uses the design's primary color, with a thin beam, smoky volumetric fog, glow, and a fixed full-screen canvas behind the UI.Pro
WebGL124 uses

Magic Rings Telemetry Aesthetic

A technical industrial-minimalist design system featuring skeuomorphic UI, glassmorphism, and reactive WebGL orbital ring fields.

A technical industrial-minimalist design system featuring skeuomorphic UI, glassmorphism, and reactive WebGL orbital ring fields.Pro
WebGL97 uses

Corner Lasers

Create a corner-anchored laser composition with thin beams, a bright emitter node, bloom, and atmospheric glow or fog.

Create a corner-anchored laser composition with thin beams, a bright emitter node, bloom, and atmospheric glow or fog.Pro
WebGL63 uses

Atmospheric Grain WebGL Background

A technical, meditative background field using GLSL shaders for granular noise and morphing geometric primitives.

A technical, meditative background field using GLSL shaders for granular noise and morphing geometric primitives.Pro
WebGL62 uses

Technical ASCII Particle Field

Implementation of an atmospheric data-flow background featuring interactive ASCII nodes and upward kinetic beams using HTML5 Canvas.

Implementation of an atmospheric data-flow background featuring interactive ASCII nodes and upward kinetic beams using HTML5 Canvas.Pro
WebGL58 uses

Procedural Mesh Network Background

A meditative, dark blue procedural mesh gradient with technical overlays and reactive turbulence.

A meditative, dark blue procedural mesh gradient with technical overlays and reactive turbulence.Pro
WebGL38 uses

Organic Aetherial WebGL Background

Technical retro-futurist Three.js background with noise-displaced organic geometry, iridescent Fresnel shaders, and scroll-synced depth.

Technical retro-futurist Three.js background with noise-displaced organic geometry, iridescent Fresnel shaders, and scroll-synced depth.Pro
WebGL37 uses

Atmospheric Procedural WebGL Background

Technical shader-based background system featuring noise-driven organic glows, mouse-responsive parallax drift, and a dark meditative atmosphere.

Technical shader-based background system featuring noise-driven organic glows, mouse-responsive parallax drift, and a dark meditative atmosphere.Pro
WebGL29 uses

Technical Shader Surface (WebGL)

Procedural deep-navy mesh gradient with technical overlays, meditative breathing motion, and shader-driven calibration grids.

Procedural deep-navy mesh gradient with technical overlays, meditative breathing motion, and shader-driven calibration grids.Pro
WebGL17 uses

Technical WebGL Fluid Nebula Background

Advanced Three.js background system featuring noise-deformed fluid glows, sweeping light beams, and grain overlays.

Advanced Three.js background system featuring noise-deformed fluid glows, sweeping light beams, and grain overlays.Pro
WebGL4 uses

Chromatic Dispersion WebGL System

Generative background system featuring warped light bands with chromatic aberration, noise overlays, and interactive shader parameters.

Generative background system featuring warped light bands with chromatic aberration, noise overlays, and interactive shader parameters.Pro