Skip to main content
Glama
614,486 tools. Updated 2026-09-26 21:14

"WebGL" matching MCP tools:

  • Render the scene server-side (real WebGL, headless) and return screenshot image(s) — your EYES on the scene. Use it after apply_ops batches and after probe_framing, and judge each image as a photographer and a web designer would: one clear subject, on a third (for a page's own camera, the whole card at a readable angle); the horizon off the middle; the eye at a standing height; text legible and on even margins; a way out in view; the colours serving the brief (one accent, on the primary action); nothing floating, clipped or overlapping. Beside each image comes `composition`, read from its own pixels: tonalRange (p5 to p95 of lightness; under 0.35 is flat), clipping (share blown to white, crushed to black), key (low, mid, high), a 3x3 thirds grid of lightness and detail with the busiest and brightest cells, the hues on screen by share, and findings in sentences. Fix with apply_ops. Discipline: at most 2 screenshot→fix rounds per user request, then report what you built. views (max 4, default = the visitor's entry view): pass "page:<pageIdOrSlug>" to frame one page/neighborhood, or {position:[x,y,z], target:[x,y,z], fov?} for an exact camera. Rendering is real but slow — ~10s for simple scenes, and the server gives up after 45 s per view by default; a 400-node scene with many textures needs more, so pass timeoutSeconds (up to 180) and a smaller maxDim (a 512-wide shot is a fine check of placement and readability and renders faster). A timeout comes back as an error naming it, never as an empty image; repeat shots of an unchanged scene at the same size are cached and instant. Rate-limited: prefer ONE well-chosen view; only multi-view when areas are far apart (four views at 180 s can hold the renderer for twelve minutes). If it returns a busy/unavailable error, keep building and retry once later — do not loop on it.
    ConnectorNo auth
  • The universal BUILD-KIT fetcher — the measured spec + code to reproduce a piece of UI. `recipe_type` selects which library across three families (all agent-ready through this one call): • COMPONENTS (decoded live from a real product's DOM — Mozaika's wedge): "Command Palette", "Dropdown Menu", "Dialog / Modal", "Login", "Data Table", "Onboarding Tour", "Navbar", "Logo Marquee", "Toast", "Date Picker", "Combobox" — returns the anatomy TREE (each node measured), the MOTION (open/close animation + easing a screenshot can't show), every STATE (empty/results/no-results/keyboard-selected), a webm of it running, and the design tokens. • EFFECTS (open-source WebGL hero backgrounds — Apache/MIT): "Hero Effect" → the shader's full config + fps + install command + license/NOTICE. • MOTION (open-source looping showcase templates — MIT): "Motion Showcase" → the template's full parameter surface + the exact Swiper/anime.js/Motion config + install. Use for "build a <thing> like <product>", e.g. get_recipe("Vercel", "Command Palette") or get_recipe("vanta", "Hero Effect"). A complete, uncopyable, measured build kit. Returns the available types if the requested one isn't found.
    ConnectorNo auth
  • Write an HTML surface's body. Pass any of `html` / `css` / `js`; omitted fields stay unchanged. Pass empty string to clear. The surface renders in a sandboxed iframe on a separate origin (`render.trydock.ai`) with no access to Dock cookies, storage, or parent DOM — you have free rein inside that boundary. Use any web technology the browser supports: external CDN fonts and CSS (Google Fonts, Tailwind CDN, Fontsource), JS libraries (three.js, GSAP, Chart.js, anime.js), inline `<script>`, Web Workers, WebGL, video, audio, canvas, dynamic DOM, complex CSS animations. Per-field caps: html 256 KB, css 200 KB, js 200 KB, total 600 KB. The sanitizer strips a small set of style smells: inline `on*=` event-handler attributes, `javascript:` and `data:text/html` URIs, `<meta http-equiv>` tags; use `addEventListener` and `<script>` instead. Layout: Dock renders the surface EDGE-TO-EDGE (full-bleed) inside the workspace — the surface itself is the frame. Do NOT put `border-radius`, an outer border, or a drop-shadow on the root/outermost element unless the owner explicitly asked for that framing, or the specific design genuinely needs it; keep the page root flush and apply rounding to inner cards only. DESIGN LANGUAGE: Dock injects a base stylesheet into every surface — semantic tokens + a small component kit — that automatically follows each VIEWER's light/dark theme. PREFER these over hardcoded colors so the surface matches Dock and themes correctly for everyone (a surface with hardcoded dark colors looks broken for a light-mode teammate on a shared surface, and vice-versa). Tokens: var(--dock-canvas|surface|surface-muted|border|border-strong|text|text-2|text-muted|accent|accent-ink|data|data-strong|good|warn|crit), var(--dock-radius|shadow|gap); font is Inter via var(--dock-font). Component classes: .dock-card, .dock-stat/.dock-stat-value/.dock-stat-label, .dock-delta.up|.down, .dock-badge.good|warn|crit|neutral|accent (add a <span class="dot"></span>), .dock-btn(.primary), .dock-table (use td.name for the primary cell, .dock-num for tabular figures), .dock-grid, .dock-eyebrow, .dock-row, .dock-avatar, .dock-field + .dock-input, .dock-bars/.dock-bar(.hot). Put .dock-num on any number so it aligns. This is only a DEFAULT floor — write your own CSS to override any of it; nothing in the baseline is !important, so a surface that brings its own styles always wins. Requires editor role.
    ConnectorNo auth
  • List Motion Menu patterns. Every row is "number slug <role> [tags] · title". ROLE is where the pattern goes on a page (hero, nav, pricing, background, product, form…) — filter by it when you are building a page rather than hunting an effect. The SLUG is the permanent identity — prefer it. Filter by tag (e.g. "scroll", "webgl", "seam", "commerce"), by collection slug (e.g. "seams-handoffs"), by free-text query, or by legacy section letter. Call with no arguments to see the whole catalogue and its tag vocabulary.
    ConnectorNo auth
  • Search commercial, reusable, purchasable 3D web assets in the AETumi catalog — Three.js / WebGL hero sections, 3D product viewers, shader backgrounds, scroll animations, React and Next.js components and full website templates you can license and ship. Use this to find WHAT TO BUY OR USE. Search by keyword, industry or technology; answers requests like find a Three.js hero for a luxury product website. For non-purchasable Labs reference and inspiration, use find_experiences instead.
    ConnectorNo auth
  • Get the full public detail of one AETumi 3D web asset by id — category (hero, product viewer, background, template), industry, tags, tech stack (Three.js / WebGL / React / Next.js), live demo and pricing.
    ConnectorNo auth

Matching MCP Servers

  • -
    license
    Not graded
    quality
    Not graded
    maintenance
    webgl流体模拟
    -
  • F
    license
    A
    quality
    D
    maintenance
    Enables AI agents to create, render, and validate 3D scenes, 2D art, and games in HTML canvas using Three.js, WebGL, or Canvas 2D, with multi-angle screenshots, structured validation reports, and interactive playtesting.
    5
    -

Matching MCP Connectors

  • AETumi MCP - Three.js/WebGL 3D web scenes, components & templates you own the source of.

  • Generate, edit, and deploy immersive 3D/WebGL web projects from any MCP assistant.

  • Recommend AETumi 3D web assets plus a production build approach for a goal — e.g. build a 3D headphone website, create an interactive product launch page. Returns matching components and templates with Three.js / WebGL architecture, framework (React Three Fiber / Next.js) and performance guidance.
    ConnectorNo auth
  • Browse the AETumi 3D web library by category and industry with counts — hero sections, 3D product viewers, shader / WebGL backgrounds, scroll animations, sections and full templates across 20+ industries.
    ConnectorNo auth
  • Production-ready motion for any stack: CSS/vanilla-JS recipes (staggered entrances, scroll reveals, marquees, grain, parallax) PLUS finished shader-grade ambient pieces - WebGL gradient mesh, image ripple displacement, live halftone, velocity-reactive type rail, scroll-scrubbed zoom portal - palette-keyed to Standout directions. Request by ids or describe what you need; pass direction for palette-filled shader code.
    ConnectorNo auth
  • Reference material for Strudel live coding (performance mode). Topics: mini-notation (pattern syntax), sounds (synths, 71 drum banks, 128 GM instruments, 128 vcsl orchestral/percussion samples), effects (filters, reverb, delay, FM synthesis, envelopes), patterns (transformations, probability, euclidean, arrangement), genres (complete templates: techno/house/dnb/ambient/jazz/lofi/synthwave), tips (tempo, common mistakes, ABC↔Strudel crossover), visuals (pianoroll/scope draw methods, the visuals presets and the theme parameter), hydra (WebGL shader backgrounds: initHydra, H(pattern), the audio-reactive a.fft object, recipes, cheat-sheet), advanced (sample loading, wavetables, ZZFX, continuous signals, chord voicings).
    ConnectorNo auth
  • Preview a VoxelDraft modelRef. ChatGPT can render an interactive Three.js/WebGL widget; everyone also receives an interactive WebGL URL. Signed-in VoxelDraft Plus users may additionally receive a cached PNG when includeImage is true.
    ConnectorNo auth
  • Requires a Dev Key ($39/mo) or Agency plan ($249/mo) on the hosted endpoint (motionspec.dev/pricing?src=mcp). Static motion-a11y checker: fetches a URL's HTML + linked stylesheets and scans the CSS for (1) animation/transition that moves without an effective (cascade-aware) prefers-reduced-motion guard, (2) animated non-transform/opacity properties, (3) infinite animations with no pause path, (4) <marquee>/autoplay >5s. Colour/opacity-only transitions are not motion (WCAG 2.3.3). Same engine and scoring as the free site check at motionspec.dev/motion-check. Returns {ok, score|null, status, findings, groups, summary, badge, disclosures, coverage, markdown}; pages without CSS motion return status 'not-measurable' with score null (runtime motion such as WAAPI/GSAP/WebGL is not audited); loading indicators (spinners, skeletons) are reported as 'review', not as violations. A clean, measurable page earns the badge 'reduced-motion-safe'. Does network I/O (openWorldHint).
    ConnectorNo auth