CrystalMesh Gradient

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:

1. Insert: Drag the Crystal Mesh Gradient component onto your canvas.

2. Sizing: Set Width and Height to "Fill" (100%) to cover the entire section.

3. Theme: In the properties panel, select a Theme (e.g., "Neon Night"). If you want specific colors, switch to "Custom".

4. Customize: If using "Custom", pick your Start/End Colors for the gradient and the Line/Shard Colors.

5. Fine Tune: Adjust Density (try 6-8 for balanced looks) and Speed (0.1 for slow, 1 for fast) to suit your vibe.