Elevate your website with Crystal Mesh Gradient, a high-performance generative background that combines low-poly aesthetics with a dynamic plexus network. This component renders floating geometric shards and connected nodes using HTML5 Canvas, ensuring buttery-smooth performance even on mobile devices.
It creates a sophisticated, "tech-savvy" atmosphere, making it the ideal choice for crypto platforms, AI startups, and modern portfolios. Choose from beautiful built-in presets like "Neon Night" and "Ocean Blue," or fully customize the palette to match your brand identity.
Functions (Key Features):
💎 Dual Effect: Combines semi-transparent crystal shards (triangles) with a connected line network (plexus).
🎨 Theme Presets: Includes 6 ready-to-use themes (Neon, Ocean, Sunset, Forest, Royal) plus a Custom mode.
⚡ Canvas Rendering: Built on the HTML Canvas API for ultra-fast, lag-free animation compared to heavy video files.
🎛️ Adjustable Complexity: Control the Density to make the mesh sparse and clean, or dense and complex.
🚀 Custom Motion: Tweak the animation Speed to create a calm ambient effect or a high-energy background.
How to Use:
Insert: Drag the Crystal Mesh Gradient component onto your canvas.
Sizing: Set Width and Height to "Fill" (100%) to cover the entire section.
Theme: In the properties panel, select a Theme (e.g., "Neon Night"). If you want specific colors, switch to "Custom".
Customize: If using "Custom", pick your Start/End Colors for the gradient and the Line/Shard Colors.
Fine Tune: Adjust Density (try 6-8 for balanced looks) and Speed (0.1 for slow, 1 for fast) to suit your vibe.