Wave Divider

Animated SVG wave as a decorative section separator.

Surfaces

webgoogle-meet-stagegoogle-apps-script-webgoogle-apps-script-side-panelmcp-apps

Live preview

Fields

Field	Type
color	wave fill colour (default var(--a2ui-accent))	required
height	wave height in px (default 60)	required
speed	animation cycle in seconds (default 8)	required
opacity	fill opacity (default 0.15)	required
flip	reverse wave direction (default false)	required
animate	animate the wave (default true)	required

Example payload

{
  "type": "wave_divider"
}

ARD catalog entry

{
  "identifier": "urn:air:a2uicatalog.ai:atom:wave_divider",
  "displayName": "Wave Divider",
  "type": "application/vnd.a2ui.atom+json",
  "url": "https://a2uicatalog.ai/atoms/wave_divider",
  "capabilities": [
    "web",
    "google-meet-stage",
    "google-apps-script-web",
    "google-apps-script-side-panel",
    "mcp-apps"
  ],
  "description": "Animated SVG wave as a decorative section separator.",
  "representativeQueries": [
    "show a animated wave section separator",
    "animated svg wave as a decorative section separator.",
    "render a wave divider"
  ]
}

← Full ARD catalog

Deploy your own Google Apps Script renderer

The renderer is an open-source Google Apps Script web app. Deploy your own instance in 4 commands — you own the URL, no dependency on the demo endpoint.

git clone https://github.com/a2uicatalog/a2ui
cd a2ui/apps-script-surface/gas-wired-renderer
clasp push && clasp deploy

Full deploy guide →