Procedural UI And Animation System

Procedural UI And Animation — 50+ shapes, GPU-rendered directly in Unity UI. No sprites needed. Gradients, glows, shadows, outlines,25+ animations & full customization from one inspector.

Key Features:

• 50+ procedural shape types — no sprites or textures required
• Resolution-independent vector rendering at any screen size
• 6 fill modes: Solid, Gradient (5 types), Texture (5 mapping modes), Sprite, Pattern (6 types)
• Outline system with 6 stroke styles, 3 alignment modes, and gradient/texture stroke support
• Glow, Shadow (outer + inner, 18 presets), Blur, Bevel, and 3D Rotation effects
• 22 animation presets with custom curves, looping, speed, and delay
• Adaptive mesh quality (Low/Medium/High/Ultra) with size-based segment scaling
• Per-corner radius control for rounded rectangles
• Health/Progress bars with linear and radial fill modes
• Tooltip and Dialog bubbles with adjustable tail size and position
• PNG export with transparent background and resolution multiplier
• ScriptableObject-based style presets for consistent theming
• HDR color support for bloom-compatible glow effects
• Rotation, Flip X/Y transforms on every shape
• Custom Polygon shape with arbitrary vertex input
• Single UIShape component — clean inspector, zero setup
• Built on Unity's native UI (MaskableGraphic) — works with Canvas, LayoutGroups, Masks, and RaycastTarget
• Zero external dependencies
• Full C# source code included

Build stunning UI without a single sprite.Procedural UI And Animation System generates pixel-perfect vector shapes at runtime using Unity's built-in UI system. Every shape is resolution-independent, infinitely customizable, and renders in a single draw call — no render textures, no extra cameras, no shader replacements.

DOCUMENTATION

Drop a UIShape component on any GameObject, pick from 44 shape types, and start designing. Rounded buttons, health bars, tooltip bubbles, gear icons, lightning bolts — all procedural, all configurable from one clean inspector.

Shape Library — 44 Types Across 4 Categories

Basic Shapes (20): Rectangle, Rounded Rectangle (per-corner radius), Circle, Ellipse, Square, Triangle, Diamond, Pentagon, Hexagon, Octagon, Star (configurable points & inner radius), Heart, Cross, Plus, Line, Capsule, SemiCircle, Arc (start/end angle), Ring (adjustable inner radius), Pie Shape.

Directional Shapes (7): Arrow Left/Right/Up/Down (adjustable head width, head height, body thickness, tail length), Chevron (configurable angle & thickness), Double Arrow, Curved Arrow.

Game UI Shapes (9): Health Bar, Progress Bar (both support linear & radial fill with customizable background color and corner radius), Badge, Tag, Tooltip Bubble, Dialog Bubble (adjustable tail size & position), Button Shape, Panel Shape, Notification Bell.

Advanced Shapes (8): Cloud, Lightning Bolt, Gear (configurable teeth & inner radius), Ribbon, Banner, Moon (adjustable phase from new to full), Explosion (configurable spike count), Custom Polygon (arbitrary vertex positions).

Fill System — 6 Modes

• Solid — flat color with opacity control and HDR support
• Gradient — Linear, Radial, Angular, Diamond, and Reflected types with full Gradient editor, angle rotation, offset, and scale
• Texture — apply any Texture2D with Stretch, Fit, Fill, Repeat, or Mirror mapping modes plus UV offset, scale, and rotation
• Sprite — use existing sprite assets as fill
• Pattern — procedural Dots, Diagonal Lines, Grid, Noise, Zigzag, and CrossHatch with foreground/background colors and density control

Outline & Stroke System

Draw borders around any shape with full control:

• Stroke types: Solid, Dashed, Dotted, Dash-Dot, Long Dash, and Custom patterns
• Alignment: Inside, Center, or Outside the shape boundary
• Cap types: Flat or Round
• Stroke fills: Solid color, gradient, or texture — the outline system supports the same rich fills as the shape itself

Visual Effects — Layer & Combine

Stack multiple effects on a single shape:

• Glow — colored outer glow with adjustable spread, ring count, and opacity
• Shadow — outer and inner shadows with 18 built-in presets (Diagonal, Bottom, Right, Center, Large, and Perspective variants) plus full manual control over angle, distance, size, blur, opacity, and softness
• Blur — Gaussian edge softening
• Bevel — emboss/deboss with configurable light angle and depth
• 3D Rotation — perspective transforms applied directly to the mesh

Animation System — 25 Built-In Presets

Animate any shape without writing code:

• Fade: FadeIn, FadeOut, Blink
• Scale: Pop, Heartbeat, Bounce, Pulse, PingPong
• Movement: Float, Shake, Slide, Hover, Bob
• Attention: Wiggle, Elastic, Jelly, Flash
• Loading: Spinner, Rotate, CircularFill, Breathing
• Every animation supports custom duration, delay, speed, looping, and easing curves.
• Style Presets
• Save and reuse your favorite configurations as ScriptableObject presets. Apply consistent styling across your project with one click.
• PNG Export
• Export any shape as a high-resolution PNG directly from the editor. Supports transparent backgrounds, configurable padding, and resolution multipliers (1x–4x) for asset generation workflows.
• Quality Control
• Four mesh quality levels — Low, Medium, High, Ultra — with adaptive segment counts that scale based on shape size. A 50px circle uses fewer vertices than a 500px one. Target mobile with Low quality or use Ultra for hero UI elements.
• Genre Agnostic

Procedural UI And Animation System is designed for every genre and platform:

• Mobile games — health bars, progress indicators, XP bars with radial fill
• RPGs & strategy — badges, tags, notification bells, tooltip/dialog bubbles
• Casual & hyper-casual — colorful buttons, capsule shapes, stars, hearts
• Sci-fi & tech — gears, arcs, rings, lightning bolts, custom polygons
• Productivity & apps — clean panels, rounded rectangles, outlined cards

Every parameter is exposed in the inspector. No coding required to design. Full C# API available for runtime customization.