WebGL Metaballs

Create unique and modern interactive blobilicious 3D background scenes with ease.

WebGL Metaballs

• Shape Style: The metaballs visual style.
• Speed Factor: The speed at which the metaballs move.
• Color Mode: The shading style used to color the metaballs.
  • Shaded: Phong-based lighting with a single light in the top right corner.
  • Shaded2: Phong-based lighting with 2 lights. 1 in the top right and 1 in the bottom left.
  • Aura: A fresnel effect that creates an aura or highlight-like effect.
  • Sci-fi: Phong-based lighting with 2 lights where you can freely choose the color of the lights. This mode when coupled with the Brightness and Shininess settings allows you to create Gradients, Shiny neon-lighting etc.
• Color: The base color. When using the Sci-fi color mode, this setting is used for the top right light.
• Color 2: Only applies to the Sci-fi color mode. The color of the bottom left light.
• Aura Color: The aura effect color.
• Aura Spread: How much the aura spreads across the shape.
• Transforms:
  • Auto Rotate: Add a 3D rotations to the shapes, this adds more variations to the default Shape Styles.
  • Position: The position of the shape on the viewport.
  • Zoom Level: The camera zoom level.
• Interactions:
  • Enable Mouse: Enable mouse interaction. An Additional shape is drawn on the screen that tracks the mouse and blends with the metaballs shape when an intersection occurs.
  • Type: The shape of the element.
  • Mouse Radius: The size of the shape.
• Apply to whole page: Apply the background to the whole page.
• Disable on touch devices:  Disables the extension on touch devices.