{"categories":["Brand","Motion","Foundations","Expressions","Components"],"license":{"identifier":"MIT","serviceUse":"browsing and artifact generation permitted","sourceGrant":"use, copy, modify, merge, publish, distribute, sublicense, and sell","sourceAvailable":true,"url":"https://opensource.org/license/mit"},"browserStudioLocalFiles":true,"browserApi":{"event":"glyphfield:studio-api-ready","global":"window.glyphfield.studio","operations":{"activate":"Activate any visible control by its accessible label","activeTool":"Return the active Studio tool ID","applySource":"Apply a JSON object or string through the active tool validator","controls":"List visible interactive controls and current values","describe":"List exact actions, input/output contracts, source support, exports, and HTTP capability for the active tool","download":"Save a generated Blob artifact with its deterministic file name","invoke":"Invoke source, control, export, or tool-specific actions","readSource":"Read the exact current source document","set":"Set a visible form control by accessible label"},"standardActionContracts":{"artifact.download":{"description":"Download a previously returned Blob artifact using its deterministic file name.","input":"{ blob: Blob, fileName: non-empty string }","output":"{ fileName: string }"},"control.activate":{"description":"Activate one enabled control in the active Studio workspace by exact accessible label.","input":"Accessible control label string","output":"null"},"control.set":{"description":"Set one enabled form control in the active Studio workspace by exact accessible label.","input":"{ label: string, value: string | number | boolean | File | File[] }","output":"null"},"controls.list":{"description":"List enabled interactive controls scoped to the active Studio workspace.","input":"No input","output":"Array of { kind, label, value? }"},"source.apply":{"description":"Validate and apply a JSON string or object through the active tool source boundary.","input":"JSON string or object","output":"Normalized source string when readable, otherwise null"},"source.read":{"description":"Read the active tool source document without mutating it.","input":"No input","output":"JSON string"}},"standardActions":["artifact.download","control.activate","control.set","controls.list","source.apply","source.read"],"toolCapabilities":{"animation":{"directHttpGeneration":[],"exports":[{"action":"animation.export.gif","format":"GIF","route":"browser-action"},{"action":"animation.export.mp4","format":"MP4","route":"browser-action"},{"action":"animation.export.png","format":"PNG poster frame","route":"browser-action"},{"action":"animation.export.project","format":"JSON project","route":"browser-action"}],"source":{"apply":true,"boundary":"CanvasDocument schema 2 with Animation state and portable assets","format":"JSON","read":true}},"blog":{"directHttpGeneration":["template"],"exports":[{"action":"blog.export.png","format":"PNG","route":"browser-action"},{"action":"blog.export.svg","format":"SVG","route":"browser-action"},{"format":"SVG","route":"http"}],"source":{"apply":true,"boundary":"Expression document: CanvasDocument schema 2 with expression source version 2","format":"JSON","read":true}},"brand-book":{"directHttpGeneration":[],"exports":[{"action":"brand-book.print","format":"PDF print flow","route":"browser-action"}],"source":{"apply":true,"boundary":"Brand book section order and visibility, and per-page visibility, layout, surface, image, and copy","format":"JSON","read":true}},"brand-elements":{"directHttpGeneration":["element-brief"],"exports":[{"action":"brand-element.export.png","format":"PNG at real pixel size","route":"browser-action"},{"action":"brand-element.export.html","format":"HTML email (inlined styles)","route":"browser-action"},{"action":"brand-element.export.brief","format":"JSON brief","route":"browser-action"}],"source":{"apply":true,"boundary":"Selected brand-element override","format":"JSON","read":true}},"buttons":{"directHttpGeneration":[],"exports":[{"action":"components.code.read","format":"React + Tailwind or HTML + CSS component code","route":"browser-action"},{"action":"components.code.copy","format":"Component code via clipboard","route":"browser-action"}],"source":{"apply":true,"boundary":"Component Library workspace configuration (version 2: pattern, content, system, palette, typography, theme, code format)","format":"JSON","read":true}},"colors":{"directHttpGeneration":[],"exports":[{"action":"colors.tokens.copy","format":"OKLCH CSS, CSS variables, Tailwind v4 or DTCG tokens via clipboard","route":"browser-action"},{"action":"colors.tokens.read","format":"OKLCH CSS, CSS variables, Tailwind v4 or DTCG tokens","route":"browser-action"}],"source":{"apply":true,"boundary":"Identity palette, colorPairings and colorSystem (version 2), plus per-token opacity","format":"JSON","read":true}},"design-board":{"directHttpGeneration":[],"exports":[{"action":"moodboard.export.png","format":"PNG","route":"browser-action"},{"action":"moodboard.export.svg","format":"SVG","route":"browser-action"},{"action":"moodboard.export.identity","format":"Identity JSON","route":"browser-action"}],"source":{"apply":true,"boundary":"Moodboard boards, tiles (order, visibility, layout, size, surface, image, copy), and export settings","format":"JSON","read":true}},"identity":{"directHttpGeneration":[],"exports":[{"action":"identity.export.json","format":"BrandIdentity JSON","route":"browser-action"},{"action":"identity.export.kit","format":"Brand kit ZIP, DTCG JSON, CSS, Tailwind v4 theme, brand.md, logo ZIP","route":"browser-action"},{"format":"DTCG JSON, CSS, Tailwind v4 theme, brand.md via POST /api/brand/kit","route":"http"}],"source":{"apply":true,"boundary":"Complete BrandIdentity","format":"JSON","read":true}},"lottie":{"directHttpGeneration":[],"exports":[{"action":"lottie.export.frame.png","format":"PNG frame","route":"browser-action"},{"action":"lottie.export.gif","format":"GIF","route":"browser-action"},{"action":"lottie.export.mp4","format":"MP4","route":"browser-action"},{"action":"lottie.export.source","format":"JSON or .lottie","route":"browser-action"}],"source":{"apply":true,"boundary":"Portable Lottie composition; raw animation data retained when authorized","format":"JSON","read":true}},"material":{"directHttpGeneration":["design-sequence"],"exports":[{"action":"design.export.png","format":"PNG","route":"browser-action"},{"action":"design.export.jpg","format":"JPG","route":"browser-action"},{"action":"design.export.gif","format":"GIF","route":"browser-action"},{"action":"design.export.mp4","format":"MP4","route":"browser-action"},{"action":"design.export.project","format":"JSON project","route":"browser-action"}],"source":{"apply":true,"boundary":"CanvasDocument schema 2 with Design Lab metadata source 4","format":"JSON","read":true}},"opengraph":{"directHttpGeneration":["background","template"],"exports":[{"action":"opengraph.export.png","format":"PNG","route":"browser-action"},{"action":"opengraph.export.svg","format":"SVG","route":"browser-action"},{"format":"SVG background","route":"http"}],"source":{"apply":true,"boundary":"Expression document: CanvasDocument schema 2 with expression source version 2","format":"JSON","read":true}},"partnership":{"directHttpGeneration":["template"],"exports":[{"action":"partnership.export.png","format":"PNG","route":"browser-action"},{"action":"partnership.export.svg","format":"SVG","route":"browser-action"},{"format":"SVG","route":"http"}],"source":{"apply":true,"boundary":"Expression document: CanvasDocument schema 2 with expression source version 2","format":"JSON","read":true}},"slides":{"directHttpGeneration":["template"],"exports":[{"action":"slides.export.png","format":"PNG","route":"browser-action"},{"action":"slides.export.svg","format":"SVG","route":"browser-action"},{"action":"slides.export.pdf","format":"PDF deck","route":"browser-action"},{"format":"SVG","route":"http"}],"source":{"apply":true,"boundary":"Expression document: CanvasDocument schema 2 with expression source version 2 (one page per slide)","format":"JSON","read":true}},"terminal":{"directHttpGeneration":["template"],"exports":[{"action":"terminal.export.png","format":"PNG","route":"browser-action"},{"action":"terminal.export.svg","format":"SVG","route":"browser-action"},{"format":"SVG","route":"http"}],"source":{"apply":true,"boundary":"Expression document: CanvasDocument schema 2 with expression source version 2","format":"JSON","read":true}},"typography":{"directHttpGeneration":[],"exports":[{"action":"typography.tokens.read","format":"CSS, Tailwind v4 or DTCG type tokens","route":"browser-action"},{"action":"typography.tokens.copy","format":"Type tokens via clipboard","route":"browser-action"}],"source":{"apply":true,"boundary":"Identity typography roles and typeScale plus specimen settings (version 2)","format":"JSON","read":true}}},"toolActions":{"animation":{"animation.export":{"description":"Render the current Animation workspace with its authentic timeline, shaders, and MP4 audio mix, or a PNG poster frame at the playhead.","input":"{ format: 'gif' | 'mp4' | 'png', download?: boolean }","output":"ExportPreviewAsset with a non-empty Blob and deterministic fileName; use studio.download(artifact) to save"},"animation.export.gif":{"description":"Render the current Animation workspace as GIF.","input":"No input","output":"ExportPreviewAsset with a non-empty Blob and deterministic fileName; use studio.download(artifact) to save"},"animation.export.mp4":{"description":"Render the current Animation workspace as MP4, including configured timeline audio.","input":"No input","output":"ExportPreviewAsset with a non-empty Blob and deterministic fileName; use studio.download(artifact) to save"},"animation.export.png":{"description":"Render the frame at the playhead at full output size as a PNG poster frame.","input":"No input","output":"ExportPreviewAsset with a non-empty Blob and deterministic fileName; use studio.download(artifact) to save"},"animation.export.project":{"description":"Package the complete editable animation and authorized local assets.","input":"No input","output":"ExportPreviewAsset with a non-empty Blob and deterministic fileName; use studio.download(artifact) to save"},"animation.describe":{"description":"Describe scenes with their master-timeline start, hold, outgoing transition, keyframes, and text entrance, plus brand starters.","input":"No input","output":"{ durationMs, fps, width, height, playheadMs, scenes: [{ id, index, kind, label, startMs, holdMs, transitionMs, keyframes, textAnimation }], starters }"},"animation.seek":{"description":"Pause and move the playhead; the inspector follows the displayed scene or transition.","input":"{ timeMs: non-negative number }","output":"animation.describe result"},"animation.scene.update":{"description":"Set a scene hold or outgoing transition (null follows the sequence default), its text entrance (null removes it), or its pose at the playhead (a keyframe when the layer is keyframed).","input":"{ sceneId, holdMs?: number | null, transitionMs?: number | null, textAnimation?: { preset: 'none' | 'type-on' | 'word-rise' | 'line-reveal' | 'glyph-stagger' | 'tracking-in', durationMs?, staggerMs?, easing? } | null, pose?: { alignX?, alignY?, scale?, rotation?, opacity? } } (pose channels clamp to alignX/alignY -1.5..1.5, scale 0.05..8, rotation -720..720, opacity 0..1)","output":"animation.describe result"},"animation.keyframe.set":{"description":"Add or update the scene layer keyframe at a time into its hold, optionally with a pose and outgoing easing.","input":"{ sceneId, atMs, pose?: { alignX?, alignY?, scale?, rotation?, opacity? }, easing?: [x1, y1, x2, y2] } (pose channels clamp like animation.scene.update)","output":"animation.describe result"},"animation.keyframe.remove":{"description":"Remove one keyframe; removing the last keeps its pose as the static pose.","input":"{ sceneId, keyframeId }","output":"animation.describe result"},"animation.motion.preset":{"description":"Replace a scene layer keyframes with a preset built around its settled pose.","input":"{ sceneId, preset: 'push-in' | 'rise-in' | 'slide-in' | 'pop-in' | 'float' }","output":"animation.describe result"},"animation.starter.apply":{"description":"Replace the active artboard with a brand starter composed in the identity art direction. Undo restores the previous sequence.","input":"{ starterId: 'brand-intro' | 'product-reel' | 'proof-points' }","output":"animation.describe result"}},"brand-book":{"brand-book.print":{"description":"Open the browser print flow for every visible page of the edited brand book, one 16 × 10 in page per sheet.","input":"No input","output":"null"}},"brand-elements":{"brand-element.export.brief":{"description":"Create the selected brand element configuration brief as JSON.","input":"No input","output":"ExportPreviewAsset with a non-empty Blob and deterministic fileName; use studio.download(artifact) to save"},"brand-element.export.png":{"description":"Render a brand element, including in-place edits, as PNG at its real pixel size (for example 1200 × 630 for OpenGraph), or twice that with scale 2. Selects elementId first when given.","input":"{ elementId?: string (from /api/elements), scale?: 1 | 2, download?: boolean }","output":"ExportPreviewAsset with a non-empty Blob and deterministic fileName; use studio.download(artifact) to save; width and height are the PNG pixel size"},"brand-element.export.html":{"description":"Export an email element as a send-ready HTML document: 600 px table layout, inlined styles, MSO wrapper, hidden preheader, bulletproof button and absolute image URLs. Generated header art is embedded as a PNG data URL; host it and replace the src before sending through clients that block data URLs, such as Gmail.","input":"{ elementId?: string (an email element), assetOrigin?: string (origin for image URLs, default the Studio origin), download?: boolean }","output":"ExportPreviewAsset with a non-empty Blob and deterministic fileName; use studio.download(artifact) to save; previewText holds the HTML"}},"buttons":{"components.code.copy":{"description":"Copy the generated code for a component to the clipboard: React + Tailwind (TSX and theme.css) or HTML + CSS (markup and components.css), built from the same settings as the preview.","input":"{ pattern?: component id, format?: 'react' | 'html' } (defaults to the selected pattern and code format)","output":"The copied text: every file, each headed by its file name"},"components.code.read":{"description":"Return the generated code files for a component without touching the clipboard.","input":"{ pattern?: component id, format?: 'react' | 'html' }","output":"{ pattern, files: [{ name, language, code }] }"},"components.list":{"description":"List every component pattern with its family, description and the states its preview shows.","input":"No input","output":"Array of { id, label, family, description, states }"}},"colors":{"colors.contrast.read":{"description":"Return the WCAG and APCA contrast of every text/background pair in the palette, the approved colorPairings, and the semantic role checks for light and dark.","input":"No input","output":"{ matrix: [{ foreground, background, ratio, wcag, apca, apcaLevel, approved }], pairings, semantic: { light, dark } }"},"colors.pairing.toggle":{"description":"Approve or remove one text pairing in colorPairings. New pairs record AA (4.5:1) or AA-large (3:1); pairs below 3:1 are refused. The change is pending until identity.save or Save changes.","input":"{ foreground: color id, background: color id }","output":"The resulting colorPairings array"},"colors.proportion.balance":{"description":"Apply the 60 / 30 / 10 balance to the palette: paper 60, ink 30, emphasis 10, other colors 0. Pending until saved.","input":"No input","output":"Array of { id, proportion }"},"colors.scale.read":{"description":"Return the OKLCH tint and shade scale (steps 50–950) of one palette color, or of every color.","input":"{ id?: color id }","output":"Record of color id → [{ step, hex, oklch, anchored }]"},"colors.semantic.read":{"description":"Return every semantic role (background … negative) resolved for light and dark: its color ref, HEX, derived default and whether it is overridden.","input":"No input","output":"{ light: Record<role, { ref, hex, defaultRef, overridden }>, dark: … }"},"colors.tokens.copy":{"description":"Copy color tokens to the clipboard. The default is the original OKLCH CSS; css, tailwind and dtcg include scales and semantic light/dark roles.","input":"{ format?: 'oklch-css' | 'css' | 'tailwind' | 'dtcg' } (default 'oklch-css')","output":"The copied text"},"colors.tokens.read":{"description":"Return color tokens without accessing the clipboard. The default is the original OKLCH CSS; css, tailwind and dtcg come from the brand token serializers.","input":"{ format?: 'oklch-css' | 'css' | 'tailwind' | 'dtcg' } (default 'oklch-css')","output":"Token text (CSS, Tailwind v4 theme, or DTCG JSON)"},"colors.vision.read":{"description":"Simulate the palette for a color vision deficiency (Machado 2009, full severity) and list pairs that nearly merge.","input":"{ mode?: 'normal' | 'protanopia' | 'deuteranopia' | 'tritanopia' | 'achromatopsia' } (default 'deuteranopia')","output":"{ mode, colors: [{ id, hex, simulated }], confusable: [{ first, second, distance, typicalDistance }] }"}},"design-board":{"moodboard.export.identity":{"description":"Export the active identity used by the moodboard as JSON.","input":"No input","output":"ExportPreviewAsset with a non-empty Blob and deterministic fileName; use studio.download(artifact) to save"},"moodboard.export.png":{"description":"Render the current moodboard board, including tile edits, as PNG.","input":"No input","output":"ExportPreviewAsset with a non-empty Blob and deterministic fileName; use studio.download(artifact) to save"},"moodboard.export.svg":{"description":"Package the current moodboard board as a standalone SVG with embedded fonts and images.","input":"No input","output":"ExportPreviewAsset with a non-empty Blob and deterministic fileName; use studio.download(artifact) to save"}},"identity":{"identity.export.json":{"description":"Export the complete active BrandIdentity as JSON.","input":"No input","output":"ExportPreviewAsset with a non-empty Blob and deterministic fileName; use studio.download(artifact) to save"},"identity.read":{"description":"Read the active BrandIdentity as an object (a copy; mutate through identity.apply).","input":"No input","output":"BrandIdentity object"},"identity.validate":{"description":"Validate a merge patch or complete identity against the BrandIdentity schema without applying it. The schema is served by GET /api/brand/validate.","input":"{ identity: object, mode?: 'patch' | 'full' } (default patch)","output":"{ ok: boolean, issues: [{ code, message, path, severity }] }"},"identity.apply":{"description":"Validate and merge identity source. Records merge by id (typography by role), string lists are replaced, unknown fields and project fields are kept. replace lists collections to overwrite as a whole. Throws a TypeError listing every issue.","input":"{ identity: object, mode?: 'merge' | 'replace', replace?: ('colors' | 'colorPairings' | 'applications' | 'assets' | 'fonts' | …)[], remove?: { assets?, colors?, fonts?, applications?, references?, motion?, proofAssets?: string[] }, save?: boolean }","output":"{ identity, warnings: [{ code, message, path, severity }], saved: boolean, health: { score, grade, counts } }"},"identity.asset.add":{"description":"Add an image asset from file bytes. A logo slot (mark-dark for light surfaces, mark-light for dark surfaces, wordmark, wordmark-light, mark-mono) replaces that slot in place.","input":"{ file: File, slot?: 'mark-dark' | 'mark-light' | 'wordmark' | 'wordmark-light' | 'mark-mono', id?, type?, label?, surface?, usage?, alt?, license?, sourceUrl?, sourceOwner?, redistribution?, tags?, save?: boolean }","output":"{ asset: BrandAsset }"},"identity.font.add":{"description":"Store a TTF, OTF, WOFF or WOFF2 file (2.5 MB maximum) with the identity and optionally assign it to typography roles.","input":"{ file: File, roles?: ('Display' | 'Body' | 'Accent' | 'Code')[], family?, label?, weight?, weightMin?, weightMax?, style?: 'normal' | 'italic', license?, sourceUrl?, id?, save?: boolean }","output":"{ font: BrandFontAsset }"},"identity.audit":{"description":"Run the brand health audit: completeness score, section scores, WCAG contrast pairs and findings with one-click fixes or agent prompts.","input":"No input","output":"{ schemaVersion, score, grade, counts, sections, contrast, findings: [{ id, section, severity, title, detail, fix?: { id, label }, agentPrompt }] }"},"identity.fix":{"description":"Apply one deterministic audit fix by the fix.id of a finding.","input":"{ fixId: string, save?: boolean }","output":"Brand health report after the fix"},"identity.save":{"description":"Save pending identity changes on this device so every tool and future sessions use them.","input":"No input","output":"{ saved: true }"},"identity.export.kit":{"description":"Export the brand kit: a ZIP with brand.md, DTCG tokens, CSS variables, a Tailwind v4 theme, identity.json, logos and redistributable fonts, or one of those files.","input":"{ format?: 'zip' | 'dtcg' | 'css' | 'tailwind' | 'markdown' | 'logos', download?: boolean }","output":"ExportPreviewAsset with a non-empty Blob and deterministic fileName; use studio.download(artifact) to save"},"identity.setup.prompt":{"description":"Return the ready-to-run Set up with your agent prompt for this project.","input":"{ mode?: 'new' | 'improve' }","output":"{ mode, prompt: string }"},"identity.project.create":{"description":"Create a brand project and make it the active tab in the Brand identity tool, like Add brand project. from is the Starter template (default), a built-in identity id to copy, scratch for an empty identity, or a custom project id to duplicate with its workspaces. After it resolves, read window.glyphfield.studio again: the new project's workspace owns the API.","input":"{ from?: 'starter' | 'scratch' | string (built-in or project id), name?: string }","output":"{ id, name, kind: \"custom\", from, url }"}},"lottie":{"lottie.export":{"description":"Export the current rendered PNG frame, the edited JSON/.lottie source, or the trimmed segment as GIF or MP4 with the composited background.","input":"{ format: 'png' | 'source' | 'gif' | 'mp4', download?: boolean }","output":"ExportPreviewAsset with a non-empty Blob and deterministic fileName; use studio.download(artifact) to save"},"lottie.export.gif":{"description":"Render the trimmed segment, with speed, direction, edits, and background, as GIF.","input":"No input","output":"ExportPreviewAsset with a non-empty Blob and deterministic fileName; use studio.download(artifact) to save"},"lottie.export.mp4":{"description":"Render the trimmed segment, with speed, direction, edits, and background, as MP4.","input":"No input","output":"ExportPreviewAsset with a non-empty Blob and deterministic fileName; use studio.download(artifact) to save"},"lottie.describe":{"description":"Describe the active document: top-level layers with keys, text layers, static colours, markers, segment, edits, recolour mode, and whether the brand logo layer is shown.","input":"No input","output":"{ format, source, totalFrames, frameRate, segment, layers, textLayers, colors, markers, edits, recolor, brandLogo }"},"lottie.edit":{"description":"Apply non-destructive JSON edits. Each listed field replaces the stored one: hidden layer keys, colour map, text by layer key, named markers, recolour mode, and the brand logo layer (off for imports until turned on).","input":"{ hiddenLayers?: string[], colorMap?: Record<'#RRGGBB', '#RRGGBB'>, textOverrides?: Record<layerKey, string>, markers?: [{ name, frame, duration }], recolor?: 'palette' | 'source', brandLogo?: boolean }","output":"lottie.describe result"},"lottie.colors.brand":{"description":"Map every document colour to the nearest active brand token: chromatic colours to accents, neutrals by lightness.","input":"No input","output":"lottie.describe result"},"lottie.segment.set":{"description":"Play a named marker segment or set the in and out frames.","input":"{ marker: string } | { start: number, end: number }","output":"lottie.describe result"},"lottie.export.frame.png":{"description":"Render the current Lottie frame and configured background as PNG.","input":"No input","output":"ExportPreviewAsset with a non-empty Blob and deterministic fileName; use studio.download(artifact) to save"},"lottie.export.source":{"description":"Export edited JSON or the original .lottie archive according to the active source.","input":"No input","output":"ExportPreviewAsset with a non-empty Blob and deterministic fileName; use studio.download(artifact) to save"}},"blog":{"blog.export.png":{"description":"Render the current blog-cover composition as PNG.","input":"No input","output":"ExportPreviewAsset with a non-empty Blob and deterministic fileName; use studio.download(artifact) to save"},"blog.document.describe":{"description":"Describe the blog cover: format, pages, layouts, and every layer with its id, kind, slot, bounds, visibility, and lock state (top layer first).","input":"No input","output":"{ format, formats, layouts, activePageId, selection, pages: [{ id, name, layout, surface, width, height, notes, layers }] }"},"blog.export.svg":{"description":"Render the blog cover as a self-contained SVG with embedded images and fonts.","input":"No input","output":"ExportPreviewAsset with a non-empty Blob and deterministic fileName; use studio.download(artifact) to save"},"blog.format.set":{"description":"Change the output format preset and re-flow every page; free layers scale with the page.","input":"{ format: string } using an id from document.describe().formats","output":"null"},"blog.history.redo":{"description":"Redo the last undone canvas change.","input":"No input","output":"boolean (false when nothing to redo)"},"blog.history.undo":{"description":"Undo the last canvas change.","input":"No input","output":"boolean (false when nothing to undo)"},"blog.layer.add":{"description":"Add a layer: text, image (identity library id or data:image URL), logo, shape, divider, shader (Shader Library still), texture, or brand device.","input":"{ kind: 'text' | 'image' | 'logo' | 'shape' | 'divider' | 'shader' | 'texture' | 'device', content?, bounds?, fill?, libraryAssetId?, dataUrl?, materialId?, device?, shape?: 'rect' | 'ellipse', variant?: 'mark' | 'wordmark' }","output":"{ id: string }"},"blog.layer.align":{"description":"Align layers to an artboard edge or center.","input":"{ ids: string[], alignment: 'left' | 'horizontal-center' | 'right' | 'top' | 'vertical-center' | 'bottom' }","output":"null"},"blog.layer.duplicate":{"description":"Duplicate layers with a small offset and select the copies.","input":"{ ids: string[] }","output":"{ ids: string[] }"},"blog.layer.remove":{"description":"Delete layers.","input":"{ ids: string[] }","output":"null"},"blog.layer.reorder":{"description":"Move a layer in the stack.","input":"{ id: string, to: 'forward' | 'backward' | 'front' | 'back' | number }","output":"null"},"blog.layer.select":{"description":"Select layers on the canvas and in the inspector.","input":"{ ids: string[] }","output":"null"},"blog.layer.update":{"description":"Edit a layer: text, bounds (x, y, width, height, rotation), opacity, visibility, lock, brand color role, type role, size, weight, tracking (em), line height, alignment, casing, or layer data.","input":"{ id, name?, content?, bounds?, opacity?, hidden?, locked?, fill?, fontRole?, fontSize?, fontWeight?, letterSpacing?, lineHeight?, align?, casing?, radius?, data? }","output":"null"},"blog.layout.apply":{"description":"Re-flow a page into a layout variant. Content and hand-set styles stay; geometry follows the layout.","input":"{ layout: string, pageId?: string } using an id from document.describe().layouts","output":"null"},"blog.template.reset":{"description":"Start over from the identity's brand template for this tool.","input":"No input","output":"null"}},"material":{"design.workspace.describe":{"description":"Describe the open canvas, loose layer IDs, artboards, and active editing surface.","input":"No input","output":"{ activeSurface, canvas: { layerIds }, artboards: [{ id, name, x, y, width, height, layerIds }] }"},"design.workspace.frameSelection":{"description":"Create a fitted artboard around the current loose-layer selection without changing its on-canvas scale or layout.","input":"No input; select canvas layers first using the layer controls","output":"null"},"design.workspace.activate":{"description":"Edit the loose canvas or an existing artboard with the shared layer controls.","input":"{ target: 'canvas' | artboardId }","output":"null"},"design.workspace.move":{"description":"Move active layers between the canvas and artboards, preserving their world-space boxes, text layout, and appearance. IDs change only to avoid a destination collision.","input":"{ target: 'canvas' | artboardId, layerIds: string[], placement?: 'preserve' | 'beside' }","output":"null"},"design.export":{"description":"Render the selected artboard using the authentic Design Lab renderer. Loose canvas layers are not exported; select an artboard first.","input":"{ format: 'png' | 'jpg' | 'gif' | 'mp4', mode?: 'standard' | 'shader-sequence', download?: boolean }","output":"ExportPreviewAsset with a non-empty Blob and deterministic fileName; use studio.download(artifact) to save"},"design.text.format":{"description":"Format a non-empty range of text on the active surface without changing other characters. Ordered runs survive source, history, saved designs, and export.","input":"{ layerId, start, end, style: { color?, fontRole?: 'Display' | 'Body' | 'Accent' | 'Code', fontSize?, weight?, fontStyle?: 'normal' | 'italic', underline?, strikethrough?, tracking? } }; start/end are UTF-16 offsets, end exclusive; fontSize is authored pixels before layer scale","output":"null"},"design.export.gif":{"description":"Render the current design as GIF.","input":"No input","output":"ExportPreviewAsset with a non-empty Blob and deterministic fileName; use studio.download(artifact) to save"},"design.export.jpg":{"description":"Render the current design as JPG.","input":"No input","output":"ExportPreviewAsset with a non-empty Blob and deterministic fileName; use studio.download(artifact) to save"},"design.export.mp4":{"description":"Render the current design as MP4.","input":"No input","output":"ExportPreviewAsset with a non-empty Blob and deterministic fileName; use studio.download(artifact) to save"},"design.export.png":{"description":"Render the current design as PNG.","input":"No input","output":"ExportPreviewAsset with a non-empty Blob and deterministic fileName; use studio.download(artifact) to save"},"design.export.project":{"description":"Package every editable artboard, authorized local image, shader frame, and local font in the portable project format.","input":"No input","output":"ExportPreviewAsset: non-empty application/json Blob, .glyphfield.json fileName, format JSON, previewKind file; use studio.download(artifact) to save"},"design.export.shader-sequence.gif":{"description":"Render the configured shader sequence as GIF.","input":"No input","output":"ExportPreviewAsset with a non-empty Blob and deterministic fileName; use studio.download(artifact) to save"},"design.export.shader-sequence.mp4":{"description":"Render the configured shader sequence as MP4.","input":"No input","output":"ExportPreviewAsset with a non-empty Blob and deterministic fileName; use studio.download(artifact) to save"},"design.frame.capture":{"description":"Freeze ready native shader pixels and persist lossless PNG checkpoints with editable renderer state.","input":"No input","output":"Portable CanvasDocument JSON string with embedded captured-frame assets"},"design.frame.pause":{"description":"Synchronously pause the visible native shader frame without encoding PNGs or writing captured-frame assets.","input":"No input","output":"null"},"design.frame.play":{"description":"Resume native shader playback.","input":"No input","output":"null"},"design.frame.seek":{"description":"Select shader time for editable, seekable materials; reject stateful simulation replay.","input":"{ timeMs: non-negative finite number }","output":"null"},"design.motion.describe":{"description":"Describe current layer providers, seek/capture support, and known or unverified loop behavior.","input":"No input","output":"Motion capability object for every active shader layer"},"design.sequence.configure":{"description":"Update validated shader-sequence settings.","input":"Partial shader-sequence settings object","output":"null"},"design.sequence.describe":{"description":"Describe resolved shader-sequence settings, duration, and material timeline.","input":"No input","output":"{ durationMs, materials, settings }"},"design.sequence.preview":{"description":"Start the configured shader-sequence preview.","input":"No input","output":"null"},"design.sequence.stop":{"description":"Stop the shader-sequence preview.","input":"No input","output":"null"},"design.layers.arrange":{"description":"Align unlocked layers to the bounds of the selection, or space them evenly. A fully selected group moves as one unit.","input":"{ arrangement: 'left' | 'horizontal-center' | 'right' | 'top' | 'vertical-center' | 'bottom' | 'distribute-horizontal' | 'distribute-vertical', layerIds?: string[] }; omit layerIds to use the current selection; align needs 2 units, distribute 3","output":"null"},"design.layers.lock":{"description":"Lock or unlock layers. Locked layers ignore canvas pointer and keyboard edits but stay editable in the inspector; source records element.locked.","input":"{ layerIds: string[], locked: boolean }","output":"null"},"design.layers.rotate":{"description":"Turn unlocked layers clockwise about their own centers to an absolute angle. Locked layers are skipped; source records bounds.rotation.","input":"{ layerIds: string[], rotation: number } (degrees; normalized to -180..180, 0 removes the rotation)","output":"null"},"design.layers.copyStyle":{"description":"Copy one layer's appearance (type, color, effects, opacity and material), never its content or geometry.","input":"{ layerId: string }","output":"null"},"design.layers.pasteStyle":{"description":"Apply the copied style to unlocked layers. Each target takes the fields it shares with the source; a copied material fills content layers.","input":"{ layerIds: string[] }","output":"null"},"design.effects.describe":{"description":"List the active artboard's Effect layers (built-in converter kind, or image effectId, effectProps and WebGPU status) and the image effects on offer.","input":"No input","output":"{ builtIn, imageEffects: { categories, effects, controls }, layers }"},"design.effects.add":{"description":"Add an Effect layer above every layer of the active artboard: a built-in converter (kind) or a Shaders.com image effect (effectId) that processes the composited layers beneath it. Image effects need WebGPU; exports refuse without it.","input":"{ kind?: 'bayer' | 'ascii' | 'halftone' | 'posterize', effectId?: string from /api/materials imageEffects, effectProps?: object (explicit edits; validated against nativeControls; sourceImage is not accepted), opacity?: 0..1 }","output":"{ layerId }"},"design.effects.configure":{"description":"Switch an Effect layer to another converter kind or image effectId, replace its effectProps (pass {} to reset), or set its opacity.","input":"{ layerId: string, kind?: string, effectId?: string, effectProps?: object, opacity?: 0..1 }; kind and effectId are exclusive","output":"{ layerId }"}},"opengraph":{"opengraph.export.png":{"description":"Render the current OpenGraph composition as PNG.","input":"No input","output":"ExportPreviewAsset with a non-empty Blob and deterministic fileName; use studio.download(artifact) to save"},"opengraph.document.describe":{"description":"Describe the OpenGraph composition: format, pages, layouts, and every layer with its id, kind, slot, bounds, visibility, and lock state (top layer first).","input":"No input","output":"{ format, formats, layouts, activePageId, selection, pages: [{ id, name, layout, surface, width, height, notes, layers }] }"},"opengraph.export.svg":{"description":"Render the OpenGraph composition as a self-contained SVG with embedded images and fonts.","input":"No input","output":"ExportPreviewAsset with a non-empty Blob and deterministic fileName; use studio.download(artifact) to save"},"opengraph.format.set":{"description":"Change the output format preset and re-flow every page; free layers scale with the page.","input":"{ format: string } using an id from document.describe().formats","output":"null"},"opengraph.history.redo":{"description":"Redo the last undone canvas change.","input":"No input","output":"boolean (false when nothing to redo)"},"opengraph.history.undo":{"description":"Undo the last canvas change.","input":"No input","output":"boolean (false when nothing to undo)"},"opengraph.layer.add":{"description":"Add a layer: text, image (identity library id or data:image URL), logo, shape, divider, shader (Shader Library still), texture, or brand device.","input":"{ kind: 'text' | 'image' | 'logo' | 'shape' | 'divider' | 'shader' | 'texture' | 'device', content?, bounds?, fill?, libraryAssetId?, dataUrl?, materialId?, device?, shape?: 'rect' | 'ellipse', variant?: 'mark' | 'wordmark' }","output":"{ id: string }"},"opengraph.layer.align":{"description":"Align layers to an artboard edge or center.","input":"{ ids: string[], alignment: 'left' | 'horizontal-center' | 'right' | 'top' | 'vertical-center' | 'bottom' }","output":"null"},"opengraph.layer.duplicate":{"description":"Duplicate layers with a small offset and select the copies.","input":"{ ids: string[] }","output":"{ ids: string[] }"},"opengraph.layer.remove":{"description":"Delete layers.","input":"{ ids: string[] }","output":"null"},"opengraph.layer.reorder":{"description":"Move a layer in the stack.","input":"{ id: string, to: 'forward' | 'backward' | 'front' | 'back' | number }","output":"null"},"opengraph.layer.select":{"description":"Select layers on the canvas and in the inspector.","input":"{ ids: string[] }","output":"null"},"opengraph.layer.update":{"description":"Edit a layer: text, bounds (x, y, width, height, rotation), opacity, visibility, lock, brand color role, type role, size, weight, tracking (em), line height, alignment, casing, or layer data.","input":"{ id, name?, content?, bounds?, opacity?, hidden?, locked?, fill?, fontRole?, fontSize?, fontWeight?, letterSpacing?, lineHeight?, align?, casing?, radius?, data? }","output":"null"},"opengraph.layout.apply":{"description":"Re-flow a page into a layout variant. Content and hand-set styles stay; geometry follows the layout.","input":"{ layout: string, pageId?: string } using an id from document.describe().layouts","output":"null"},"opengraph.template.reset":{"description":"Start over from the identity's brand template for this tool.","input":"No input","output":"null"}},"partnership":{"partnership.export.png":{"description":"Render the current partnership lockup as PNG.","input":"No input","output":"ExportPreviewAsset with a non-empty Blob and deterministic fileName; use studio.download(artifact) to save"},"partnership.document.describe":{"description":"Describe the partnership lockup: format, pages, layouts, and every layer with its id, kind, slot, bounds, visibility, and lock state (top layer first).","input":"No input","output":"{ format, formats, layouts, activePageId, selection, pages: [{ id, name, layout, surface, width, height, notes, layers }] }"},"partnership.export.svg":{"description":"Render the partnership lockup as a self-contained SVG with embedded images and fonts.","input":"No input","output":"ExportPreviewAsset with a non-empty Blob and deterministic fileName; use studio.download(artifact) to save"},"partnership.format.set":{"description":"Change the output format preset and re-flow every page; free layers scale with the page.","input":"{ format: string } using an id from document.describe().formats","output":"null"},"partnership.history.redo":{"description":"Redo the last undone canvas change.","input":"No input","output":"boolean (false when nothing to redo)"},"partnership.history.undo":{"description":"Undo the last canvas change.","input":"No input","output":"boolean (false when nothing to undo)"},"partnership.layer.add":{"description":"Add a layer: text, image (identity library id or data:image URL), logo, shape, divider, shader (Shader Library still), texture, or brand device.","input":"{ kind: 'text' | 'image' | 'logo' | 'shape' | 'divider' | 'shader' | 'texture' | 'device', content?, bounds?, fill?, libraryAssetId?, dataUrl?, materialId?, device?, shape?: 'rect' | 'ellipse', variant?: 'mark' | 'wordmark' }","output":"{ id: string }"},"partnership.layer.align":{"description":"Align layers to an artboard edge or center.","input":"{ ids: string[], alignment: 'left' | 'horizontal-center' | 'right' | 'top' | 'vertical-center' | 'bottom' }","output":"null"},"partnership.layer.duplicate":{"description":"Duplicate layers with a small offset and select the copies.","input":"{ ids: string[] }","output":"{ ids: string[] }"},"partnership.layer.remove":{"description":"Delete layers.","input":"{ ids: string[] }","output":"null"},"partnership.layer.reorder":{"description":"Move a layer in the stack.","input":"{ id: string, to: 'forward' | 'backward' | 'front' | 'back' | number }","output":"null"},"partnership.layer.select":{"description":"Select layers on the canvas and in the inspector.","input":"{ ids: string[] }","output":"null"},"partnership.layer.update":{"description":"Edit a layer: text, bounds (x, y, width, height, rotation), opacity, visibility, lock, brand color role, type role, size, weight, tracking (em), line height, alignment, casing, or layer data.","input":"{ id, name?, content?, bounds?, opacity?, hidden?, locked?, fill?, fontRole?, fontSize?, fontWeight?, letterSpacing?, lineHeight?, align?, casing?, radius?, data? }","output":"null"},"partnership.layout.apply":{"description":"Re-flow a page into a layout variant. Content and hand-set styles stay; geometry follows the layout.","input":"{ layout: string, pageId?: string } using an id from document.describe().layouts","output":"null"},"partnership.template.reset":{"description":"Start over from the identity's brand template for this tool.","input":"No input","output":"null"},"partnership.partner.add":{"description":"Add a partner to the lockup from the partner list or as written text.","input":"{ partnerId?: string, kind?: 'logo' | 'text', label?: string }","output":"{ id: string }"},"partnership.partner.remove":{"description":"Remove a partner from the lockup; the active brand stays.","input":"{ id: string }","output":"null"},"partnership.lockup.update":{"description":"Set lockup alignment rules.","input":"{ separator?: '×' | '+' | '/' | '|' | 'none', sizing?: 'optical' | 'height' | 'width', justify?: 'start' | 'center' | 'end', verticalAlign?: 'center' | 'top' | 'bottom', gap?: number, tone?: 'original' | 'mono' }","output":"null"}},"slides":{"slides.export.png":{"description":"Render the active slide as PNG.","input":"No input","output":"ExportPreviewAsset with a non-empty Blob and deterministic fileName; use studio.download(artifact) to save"},"slides.document.describe":{"description":"Describe the deck: format, pages, layouts, and every layer with its id, kind, slot, bounds, visibility, and lock state (top layer first).","input":"No input","output":"{ format, formats, layouts, activePageId, selection, pages: [{ id, name, layout, surface, width, height, notes, layers }] }"},"slides.export.svg":{"description":"Render the active slide as a self-contained SVG with embedded images and fonts.","input":"No input","output":"ExportPreviewAsset with a non-empty Blob and deterministic fileName; use studio.download(artifact) to save"},"slides.format.set":{"description":"Change the output format preset and re-flow every page; free layers scale with the page.","input":"{ format: string } using an id from document.describe().formats","output":"null"},"slides.history.redo":{"description":"Redo the last undone canvas change.","input":"No input","output":"boolean (false when nothing to redo)"},"slides.history.undo":{"description":"Undo the last canvas change.","input":"No input","output":"boolean (false when nothing to undo)"},"slides.layer.add":{"description":"Add a layer: text, image (identity library id or data:image URL), logo, shape, divider, shader (Shader Library still), texture, or brand device.","input":"{ kind: 'text' | 'image' | 'logo' | 'shape' | 'divider' | 'shader' | 'texture' | 'device', content?, bounds?, fill?, libraryAssetId?, dataUrl?, materialId?, device?, shape?: 'rect' | 'ellipse', variant?: 'mark' | 'wordmark' }","output":"{ id: string }"},"slides.layer.align":{"description":"Align layers to an artboard edge or center.","input":"{ ids: string[], alignment: 'left' | 'horizontal-center' | 'right' | 'top' | 'vertical-center' | 'bottom' }","output":"null"},"slides.layer.duplicate":{"description":"Duplicate layers with a small offset and select the copies.","input":"{ ids: string[] }","output":"{ ids: string[] }"},"slides.layer.remove":{"description":"Delete layers.","input":"{ ids: string[] }","output":"null"},"slides.layer.reorder":{"description":"Move a layer in the stack.","input":"{ id: string, to: 'forward' | 'backward' | 'front' | 'back' | number }","output":"null"},"slides.layer.select":{"description":"Select layers on the canvas and in the inspector.","input":"{ ids: string[] }","output":"null"},"slides.layer.update":{"description":"Edit a layer: text, bounds (x, y, width, height, rotation), opacity, visibility, lock, brand color role, type role, size, weight, tracking (em), line height, alignment, casing, or layer data.","input":"{ id, name?, content?, bounds?, opacity?, hidden?, locked?, fill?, fontRole?, fontSize?, fontWeight?, letterSpacing?, lineHeight?, align?, casing?, radius?, data? }","output":"null"},"slides.layout.apply":{"description":"Re-flow a page into a layout variant. Content and hand-set styles stay; geometry follows the layout.","input":"{ layout: string, pageId?: string } using an id from document.describe().layouts","output":"null"},"slides.template.reset":{"description":"Start over from the identity's brand template for this tool.","input":"No input","output":"null"},"slides.export.pdf":{"description":"Render every slide into one multi-page PDF (lossless page images).","input":"No input","output":"ExportPreviewAsset with a non-empty Blob and deterministic fileName; use studio.download(artifact) to save"},"slides.slide.add":{"description":"Add a slide after the active one using a layout.","input":"{ layout?: string, index?: number }","output":"{ pageId: string }"},"slides.slide.duplicate":{"description":"Duplicate a slide (default: active).","input":"{ pageId?: string }","output":"{ pageId: string }"},"slides.slide.move":{"description":"Move a slide to a new position.","input":"{ pageId: string, index: number }","output":"null"},"slides.slide.remove":{"description":"Delete a slide; the deck keeps at least one.","input":"{ pageId: string }","output":"null"},"slides.slide.select":{"description":"Show a slide on the canvas.","input":"{ pageId: string }","output":"null"}},"terminal":{"terminal.export.png":{"description":"Render the current syntax-highlighted terminal card as PNG.","input":"No input","output":"ExportPreviewAsset with a non-empty Blob and deterministic fileName; use studio.download(artifact) to save"},"terminal.document.describe":{"description":"Describe the terminal card: format, pages, layouts, and every layer with its id, kind, slot, bounds, visibility, and lock state (top layer first).","input":"No input","output":"{ format, formats, layouts, activePageId, selection, pages: [{ id, name, layout, surface, width, height, notes, layers }] }"},"terminal.export.svg":{"description":"Render the terminal card as a self-contained SVG with embedded images and fonts.","input":"No input","output":"ExportPreviewAsset with a non-empty Blob and deterministic fileName; use studio.download(artifact) to save"},"terminal.format.set":{"description":"Change the output format preset and re-flow every page; free layers scale with the page.","input":"{ format: string } using an id from document.describe().formats","output":"null"},"terminal.history.redo":{"description":"Redo the last undone canvas change.","input":"No input","output":"boolean (false when nothing to redo)"},"terminal.history.undo":{"description":"Undo the last canvas change.","input":"No input","output":"boolean (false when nothing to undo)"},"terminal.layer.add":{"description":"Add a layer: text, image (identity library id or data:image URL), logo, shape, divider, shader (Shader Library still), texture, or brand device.","input":"{ kind: 'text' | 'image' | 'logo' | 'shape' | 'divider' | 'shader' | 'texture' | 'device', content?, bounds?, fill?, libraryAssetId?, dataUrl?, materialId?, device?, shape?: 'rect' | 'ellipse', variant?: 'mark' | 'wordmark' }","output":"{ id: string }"},"terminal.layer.align":{"description":"Align layers to an artboard edge or center.","input":"{ ids: string[], alignment: 'left' | 'horizontal-center' | 'right' | 'top' | 'vertical-center' | 'bottom' }","output":"null"},"terminal.layer.duplicate":{"description":"Duplicate layers with a small offset and select the copies.","input":"{ ids: string[] }","output":"{ ids: string[] }"},"terminal.layer.remove":{"description":"Delete layers.","input":"{ ids: string[] }","output":"null"},"terminal.layer.reorder":{"description":"Move a layer in the stack.","input":"{ id: string, to: 'forward' | 'backward' | 'front' | 'back' | number }","output":"null"},"terminal.layer.select":{"description":"Select layers on the canvas and in the inspector.","input":"{ ids: string[] }","output":"null"},"terminal.layer.update":{"description":"Edit a layer: text, bounds (x, y, width, height, rotation), opacity, visibility, lock, brand color role, type role, size, weight, tracking (em), line height, alignment, casing, or layer data.","input":"{ id, name?, content?, bounds?, opacity?, hidden?, locked?, fill?, fontRole?, fontSize?, fontWeight?, letterSpacing?, lineHeight?, align?, casing?, radius?, data? }","output":"null"},"terminal.layout.apply":{"description":"Re-flow a page into a layout variant. Content and hand-set styles stay; geometry follows the layout.","input":"{ layout: string, pageId?: string } using an id from document.describe().layouts","output":"null"},"terminal.template.reset":{"description":"Start over from the identity's brand template for this tool.","input":"No input","output":"null"},"terminal.tab.add":{"description":"Add a file tab to the code window and show it.","input":"{ name?: string, language?: string, code?: string }","output":"{ tabId: string }"},"terminal.tab.remove":{"description":"Remove a file tab; the window keeps at least one.","input":"{ tabId: string }","output":"null"},"terminal.tab.select":{"description":"Show a file tab.","input":"{ tabId: string }","output":"null"},"terminal.tab.update":{"description":"Edit a tab's name, language, code, or highlighted lines (1-based).","input":"{ tabId: string, name?, language?, code?, highlight?: number[] }","output":"null"}},"typography":{"typography.axes.read":{"description":"Read the variation axes (wght, opsz, slnt …) of each role’s font file. WOFF2 needs a browser that decodes Brotli; unreadable files return null.","input":"No input","output":"Record of role → { family, fontId, axes: [{ tag, min, default, max }] | null }"},"typography.guidance.read":{"description":"Return leading, tracking, measure, scale and weight warnings for every role at its scale size.","input":"No input","output":"Array of { id, role?, severity, message }"},"typography.scale.read":{"description":"Return the modular type scale: base, ratio and its name, each step in px and rem, and the step each role is set at.","input":"No input","output":"{ basePx, ratio, ratioName, roleSteps, steps: [{ name, step, px, rem }] }"},"typography.tokens.copy":{"description":"Copy the type tokens (families, sizes, weights, leading, tracking, axes, scale) to the clipboard.","input":"{ format?: 'css' | 'tailwind' | 'dtcg' } (default 'css')","output":"The copied text"},"typography.tokens.read":{"description":"Return the type tokens without accessing the clipboard, from the brand token serializers.","input":"{ format?: 'css' | 'tailwind' | 'dtcg' } (default 'css')","output":"Token text"}}},"version":1},"counts":{"labPlugins":15,"shaders":197,"surfaces":60},"labPlugins":[{"category":"Brand","description":"Edit the shared identity, asset library, font files, colors, voice, strategy, and system defaults used everywhere.","id":"identity","keywords":["brand settings","identity","assets","asset library","fonts","font upload","colors","typography","logos","strategy","voice","foundations"],"name":"Brand identity","shortcut":"I","agentAccess":"browser-api-with-declared-http-generation","browserWorkspace":"/studio","capabilities":{"browserActions":["identity.export.json","identity.read","identity.validate","identity.apply","identity.asset.add","identity.font.add","identity.audit","identity.fix","identity.save","identity.export.kit","identity.setup.prompt","identity.project.create"],"browserApi":true,"controlAutomation":true,"directHttpGeneration":[],"exports":[{"action":"identity.export.json","format":"BrandIdentity JSON","route":"browser-action"},{"action":"identity.export.kit","format":"Brand kit ZIP, DTCG JSON, CSS, Tailwind v4 theme, brand.md, logo ZIP","route":"browser-action"},{"format":"DTCG JSON, CSS, Tailwind v4 theme, brand.md via POST /api/brand/kit","route":"http"}],"sharedShaderLibrary":false,"shaderFrameCapture":false,"source":{"apply":true,"boundary":"Complete BrandIdentity","format":"JSON","read":true},"sourceEditing":true}},{"category":"Brand","description":"Apply the active identity across digital, developer, social, editorial, event, and physical touchpoints.","id":"brand-elements","keywords":["email","cli","ascii","twitter","x post","slides","deck","lanyard","business card","web card","logo background","event badge","sticker","letterhead","press kit"],"name":"Brand elements","shortcut":"E","agentAccess":"browser-api-with-declared-http-generation","browserWorkspace":"/studio","capabilities":{"browserActions":["brand-element.export.brief","brand-element.export.png","brand-element.export.html"],"browserApi":true,"controlAutomation":true,"directHttpGeneration":["element-brief"],"exports":[{"action":"brand-element.export.png","format":"PNG at real pixel size","route":"browser-action"},{"action":"brand-element.export.html","format":"HTML email (inlined styles)","route":"browser-action"},{"action":"brand-element.export.brief","format":"JSON brief","route":"browser-action"}],"sharedShaderLibrary":false,"shaderFrameCapture":false,"source":{"apply":true,"boundary":"Selected brand-element override","format":"JSON","read":true},"sourceEditing":true}},{"category":"Brand","description":"Compose the identity as an application showcase or complete system board, then export a high-resolution PNG.","id":"design-board","keywords":["brand board","design board","moodboard","style tile","identity","guidelines"],"name":"Moodboard","shortcut":"D","agentAccess":"browser-api-with-declared-http-generation","browserWorkspace":"/studio","capabilities":{"browserActions":["moodboard.export.identity","moodboard.export.png","moodboard.export.svg"],"browserApi":true,"controlAutomation":true,"directHttpGeneration":[],"exports":[{"action":"moodboard.export.png","format":"PNG","route":"browser-action"},{"action":"moodboard.export.svg","format":"SVG","route":"browser-action"},{"action":"moodboard.export.identity","format":"Identity JSON","route":"browser-action"}],"sharedShaderLibrary":false,"shaderFrameCapture":false,"source":{"apply":true,"boundary":"Moodboard boards, tiles (order, visibility, layout, size, surface, image, copy), and export settings","format":"JSON","read":true},"sourceEditing":true}},{"category":"Brand","description":"Read, review, and export a complete editorial brand book generated from the active identity system.","id":"brand-book","keywords":["brand book","brand guide","guidelines","standards","manual","identity book","pdf","foundations","logo","typography","color","illustration","iconography","composition","showcase"],"name":"Brand book","shortcut":"K","agentAccess":"browser-api-with-declared-http-generation","browserWorkspace":"/studio","capabilities":{"browserActions":["brand-book.print"],"browserApi":true,"controlAutomation":true,"directHttpGeneration":[],"exports":[{"action":"brand-book.print","format":"PDF print flow","route":"browser-action"}],"sharedShaderLibrary":false,"shaderFrameCapture":false,"source":{"apply":true,"boundary":"Brand book section order and visibility, and per-page visibility, layout, surface, image, and copy","format":"JSON","read":true},"sourceEditing":true}},{"category":"Motion","description":"Animate text and images with deterministic packages and cubic Bézier timing.","id":"animation","keywords":["gif","morph","typing","crossfade","frames","cubic bezier"],"name":"Animation","shortcut":"A","agentAccess":"browser-api-with-declared-http-generation","browserWorkspace":"/studio","capabilities":{"browserActions":["animation.export","animation.export.gif","animation.export.mp4","animation.export.png","animation.export.project","animation.describe","animation.seek","animation.scene.update","animation.keyframe.set","animation.keyframe.remove","animation.motion.preset","animation.starter.apply"],"browserApi":true,"controlAutomation":true,"directHttpGeneration":[],"exports":[{"action":"animation.export.gif","format":"GIF","route":"browser-action"},{"action":"animation.export.mp4","format":"MP4","route":"browser-action"},{"action":"animation.export.png","format":"PNG poster frame","route":"browser-action"},{"action":"animation.export.project","format":"JSON project","route":"browser-action"}],"sharedShaderLibrary":true,"shaderFrameCapture":false,"source":{"apply":true,"boundary":"CanvasDocument schema 2 with Animation state and portable assets","format":"JSON","read":true},"sourceEditing":true}},{"category":"Motion","description":"Import, recolor, trim, preview, and export Lottie JSON or .lottie vector animation.","id":"lottie","keywords":["lottie","dotlottie","vector animation","json animation","playback","trim","recolor"],"name":"Lottie","shortcut":"L","agentAccess":"browser-api-with-declared-http-generation","browserWorkspace":"/studio","capabilities":{"browserActions":["lottie.export","lottie.export.gif","lottie.export.mp4","lottie.describe","lottie.edit","lottie.colors.brand","lottie.segment.set","lottie.export.frame.png","lottie.export.source"],"browserApi":true,"controlAutomation":true,"directHttpGeneration":[],"exports":[{"action":"lottie.export.frame.png","format":"PNG frame","route":"browser-action"},{"action":"lottie.export.gif","format":"GIF","route":"browser-action"},{"action":"lottie.export.mp4","format":"MP4","route":"browser-action"},{"action":"lottie.export.source","format":"JSON or .lottie","route":"browser-action"}],"sharedShaderLibrary":false,"shaderFrameCapture":false,"source":{"apply":true,"boundary":"Portable Lottie composition; raw animation data retained when authorized","format":"JSON","read":true},"sourceEditing":true}},{"category":"Foundations","description":"Explore with loose layers on an open canvas, then frame type, images, stickers, effects, and shaders into export-ready artboards.","id":"material","keywords":["design lab","infinite canvas","loose layers","frame selection","composition","playground","typography","rich text","selected text formatting","svg conversion","layer editor","sticker","die cut","outline","surface lab","dither","grain","texture","material","shader","webgl","shadergradient","liquid glass","liquid metal","aurora","plasma","animated","finish","reflection","shadow","gif"],"name":"Design Lab","shortcut":"M","agentAccess":"browser-api-with-declared-http-generation","browserWorkspace":"/studio","capabilities":{"browserActions":["design.workspace.describe","design.workspace.frameSelection","design.workspace.activate","design.workspace.move","design.export","design.text.format","design.export.gif","design.export.jpg","design.export.mp4","design.export.png","design.export.project","design.export.shader-sequence.gif","design.export.shader-sequence.mp4","design.frame.capture","design.frame.pause","design.frame.play","design.frame.seek","design.motion.describe","design.sequence.configure","design.sequence.describe","design.sequence.preview","design.sequence.stop","design.layers.arrange","design.layers.lock","design.layers.rotate","design.layers.copyStyle","design.layers.pasteStyle","design.effects.describe","design.effects.add","design.effects.configure"],"browserApi":true,"controlAutomation":true,"directHttpGeneration":["design-sequence"],"exports":[{"action":"design.export.png","format":"PNG","route":"browser-action"},{"action":"design.export.jpg","format":"JPG","route":"browser-action"},{"action":"design.export.gif","format":"GIF","route":"browser-action"},{"action":"design.export.mp4","format":"MP4","route":"browser-action"},{"action":"design.export.project","format":"JSON project","route":"browser-action"}],"sharedShaderLibrary":true,"shaderFrameCapture":true,"source":{"apply":true,"boundary":"CanvasDocument schema 2 with Design Lab metadata source 4","format":"JSON","read":true},"sourceEditing":true}},{"category":"Expressions","description":"Compose repeatable social previews with fonts, logos, and background assets.","id":"opengraph","keywords":["open graph","og image","social preview","font upload","logo upload"],"name":"OpenGraph","shortcut":"O","agentAccess":"browser-api-with-declared-http-generation","browserWorkspace":"/studio","capabilities":{"browserActions":["opengraph.export.png","opengraph.document.describe","opengraph.export.svg","opengraph.format.set","opengraph.history.redo","opengraph.history.undo","opengraph.layer.add","opengraph.layer.align","opengraph.layer.duplicate","opengraph.layer.remove","opengraph.layer.reorder","opengraph.layer.select","opengraph.layer.update","opengraph.layout.apply","opengraph.template.reset"],"browserApi":true,"controlAutomation":true,"directHttpGeneration":["background","template"],"exports":[{"action":"opengraph.export.png","format":"PNG","route":"browser-action"},{"action":"opengraph.export.svg","format":"SVG","route":"browser-action"},{"format":"SVG background","route":"http"}],"sharedShaderLibrary":false,"shaderFrameCapture":false,"source":{"apply":true,"boundary":"Expression document: CanvasDocument schema 2 with expression source version 2","format":"JSON","read":true},"sourceEditing":true}},{"category":"Foundations","description":"Inspect semantic colors in HEX and OKLCH across light and dark surfaces.","id":"colors","keywords":["palette","hex","oklch","tokens","primary","secondary","accent"],"name":"Color tokens","shortcut":"C","agentAccess":"browser-api-with-declared-http-generation","browserWorkspace":"/studio","capabilities":{"browserActions":["colors.contrast.read","colors.pairing.toggle","colors.proportion.balance","colors.scale.read","colors.semantic.read","colors.tokens.copy","colors.tokens.read","colors.vision.read"],"browserApi":true,"controlAutomation":true,"directHttpGeneration":[],"exports":[{"action":"colors.tokens.copy","format":"OKLCH CSS, CSS variables, Tailwind v4 or DTCG tokens via clipboard","route":"browser-action"},{"action":"colors.tokens.read","format":"OKLCH CSS, CSS variables, Tailwind v4 or DTCG tokens","route":"browser-action"}],"sharedShaderLibrary":false,"shaderFrameCapture":false,"source":{"apply":true,"boundary":"Identity palette, colorPairings and colorSystem (version 2), plus per-token opacity","format":"JSON","read":true},"sourceEditing":true}},{"category":"Foundations","description":"Compare primary, secondary, accent, and code faces or load a local font file.","id":"typography","keywords":["font selector","font upload","type scale","primary","secondary","accent","code"],"name":"Typography","shortcut":"T","agentAccess":"browser-api-with-declared-http-generation","browserWorkspace":"/studio","capabilities":{"browserActions":["typography.axes.read","typography.guidance.read","typography.scale.read","typography.tokens.copy","typography.tokens.read"],"browserApi":true,"controlAutomation":true,"directHttpGeneration":[],"exports":[{"action":"typography.tokens.read","format":"CSS, Tailwind v4 or DTCG type tokens","route":"browser-action"},{"action":"typography.tokens.copy","format":"Type tokens via clipboard","route":"browser-action"}],"sharedShaderLibrary":false,"shaderFrameCapture":false,"source":{"apply":true,"boundary":"Identity typography roles and typeScale plus specimen settings (version 2)","format":"JSON","read":true},"sourceEditing":true}},{"category":"Expressions","description":"Render Prism-tokenized TypeScript, Python, and Bash cards with matching PNG output.","id":"terminal","keywords":["code","syntax","cli","typescript","python","bash","language colors"],"name":"Terminal card","shortcut":"⌘","agentAccess":"browser-api-with-declared-http-generation","browserWorkspace":"/studio","capabilities":{"browserActions":["terminal.export.png","terminal.document.describe","terminal.export.svg","terminal.format.set","terminal.history.redo","terminal.history.undo","terminal.layer.add","terminal.layer.align","terminal.layer.duplicate","terminal.layer.remove","terminal.layer.reorder","terminal.layer.select","terminal.layer.update","terminal.layout.apply","terminal.template.reset","terminal.tab.add","terminal.tab.remove","terminal.tab.select","terminal.tab.update"],"browserApi":true,"controlAutomation":true,"directHttpGeneration":["template"],"exports":[{"action":"terminal.export.png","format":"PNG","route":"browser-action"},{"action":"terminal.export.svg","format":"SVG","route":"browser-action"},{"format":"SVG","route":"http"}],"sharedShaderLibrary":false,"shaderFrameCapture":false,"source":{"apply":true,"boundary":"Expression document: CanvasDocument schema 2 with expression source version 2","format":"JSON","read":true},"sourceEditing":true}},{"category":"Expressions","description":"Build an optically balanced active-brand and partner logo lockup.","id":"partnership","keywords":["partner","partnership lockup","co-brand","sponsor","logo upload"],"name":"Partnership lockup","shortcut":"P","agentAccess":"browser-api-with-declared-http-generation","browserWorkspace":"/studio","capabilities":{"browserActions":["partnership.export.png","partnership.document.describe","partnership.export.svg","partnership.format.set","partnership.history.redo","partnership.history.undo","partnership.layer.add","partnership.layer.align","partnership.layer.duplicate","partnership.layer.remove","partnership.layer.reorder","partnership.layer.select","partnership.layer.update","partnership.layout.apply","partnership.template.reset","partnership.partner.add","partnership.partner.remove","partnership.lockup.update"],"browserApi":true,"controlAutomation":true,"directHttpGeneration":["template"],"exports":[{"action":"partnership.export.png","format":"PNG","route":"browser-action"},{"action":"partnership.export.svg","format":"SVG","route":"browser-action"},{"format":"SVG","route":"http"}],"sharedShaderLibrary":false,"shaderFrameCapture":false,"source":{"apply":true,"boundary":"Expression document: CanvasDocument schema 2 with expression source version 2","format":"JSON","read":true},"sourceEditing":true}},{"category":"Expressions","description":"Create reusable editorial covers with controlled type and texture.","id":"blog","keywords":["blog cover","article","editorial","texture","background image"],"name":"Blog cover","shortcut":"B","agentAccess":"browser-api-with-declared-http-generation","browserWorkspace":"/studio","capabilities":{"browserActions":["blog.export.png","blog.document.describe","blog.export.svg","blog.format.set","blog.history.redo","blog.history.undo","blog.layer.add","blog.layer.align","blog.layer.duplicate","blog.layer.remove","blog.layer.reorder","blog.layer.select","blog.layer.update","blog.layout.apply","blog.template.reset"],"browserApi":true,"controlAutomation":true,"directHttpGeneration":["template"],"exports":[{"action":"blog.export.png","format":"PNG","route":"browser-action"},{"action":"blog.export.svg","format":"SVG","route":"browser-action"},{"format":"SVG","route":"http"}],"sharedShaderLibrary":false,"shaderFrameCapture":false,"source":{"apply":true,"boundary":"Expression document: CanvasDocument schema 2 with expression source version 2","format":"JSON","read":true},"sourceEditing":true}},{"category":"Expressions","description":"Build a complete 16:9 presentation system from multiple reusable slide layouts.","id":"slides","keywords":["slide templates","deck","presentation","keynote","powerpoint","title","agenda","quote","metrics","timeline"],"name":"Slide templates","shortcut":"S","agentAccess":"browser-api-with-declared-http-generation","browserWorkspace":"/studio","capabilities":{"browserActions":["slides.export.png","slides.document.describe","slides.export.svg","slides.format.set","slides.history.redo","slides.history.undo","slides.layer.add","slides.layer.align","slides.layer.duplicate","slides.layer.remove","slides.layer.reorder","slides.layer.select","slides.layer.update","slides.layout.apply","slides.template.reset","slides.export.pdf","slides.slide.add","slides.slide.duplicate","slides.slide.move","slides.slide.remove","slides.slide.select"],"browserApi":true,"controlAutomation":true,"directHttpGeneration":["template"],"exports":[{"action":"slides.export.png","format":"PNG","route":"browser-action"},{"action":"slides.export.svg","format":"SVG","route":"browser-action"},{"action":"slides.export.pdf","format":"PDF deck","route":"browser-action"},{"format":"SVG","route":"http"}],"sharedShaderLibrary":false,"shaderFrameCapture":false,"source":{"apply":true,"boundary":"Expression document: CanvasDocument schema 2 with expression source version 2 (one page per slide)","format":"JSON","read":true},"sourceEditing":true}},{"category":"Components","description":"Review core interface controls, navigation, forms, feedback, data, and commerce patterns.","id":"buttons","keywords":["component library","buttons","inputs","forms","navigation","modal","toast","table","pricing","cards"],"name":"Component library","shortcut":"V","agentAccess":"browser-api-with-declared-http-generation","browserWorkspace":"/studio","capabilities":{"browserActions":["components.code.copy","components.code.read","components.list"],"browserApi":true,"controlAutomation":true,"directHttpGeneration":[],"exports":[{"action":"components.code.read","format":"React + Tailwind or HTML + CSS component code","route":"browser-action"},{"action":"components.code.copy","format":"Component code via clipboard","route":"browser-action"}],"sharedShaderLibrary":false,"shaderFrameCapture":false,"source":{"apply":true,"boundary":"Component Library workspace configuration (version 2: pattern, content, system, palette, typography, theme, code format)","format":"JSON","read":true},"sourceEditing":true}}],"localOnly":false,"name":"Glyphfield","resources":{"agent":"/api/agent","docs":"/docs","fullInstructions":"/llms-full.txt","elements":"/api/elements","generate":"/api/generate","identities":"/api/identities","instructions":"/llms.txt","markdownDocs":"/docs/:path.md","integrationGuide":"/docs/agents/connect","labs":"/api/labs","materials":"/api/materials","openapi":"/openapi.json","search":"/api/search","skillGuide":"/docs/skills.md","surfaceTextures":"/api/surface-textures/:assetId/:map","workspace":"/studio"},"shaderLibrary":{"categories":[{"id":"all","label":"All"},{"id":"fluid","label":"Fluid"},{"id":"light","label":"Light"},{"id":"metal","label":"Metal"},{"id":"gradient","label":"Gradient"},{"id":"graphic","label":"Graphic"}],"kinds":[{"id":"all","label":"All kinds"},{"id":"backgrounds","label":"Backgrounds"},{"id":"interactive","label":"Interactive"}],"shaderEffects":{"version":"4.0.1","source":"https://github.com/shader-effects-inc/shaders","license":"MIT","components":[{"id":"shader-effects-angular-blur","component":"AngularBlur","name":"Angular Blur","category":"Blurs","description":"Radial motion blur rotating around a center point","requiresChild":true,"stateful":false,"infrastructure":null,"qualityScore":54.1},{"id":"shader-effects-arc","component":"Arc","name":"Arc","category":"Shapes","description":"Pie sector (arc wedge) with adjustable radius and aperture angle","requiresChild":false,"stateful":false,"infrastructure":null,"qualityScore":23.5},{"id":"shader-effects-ascii","component":"Ascii","name":"Ascii","category":"Stylize","description":"Convert imagery to ASCII character art","requiresChild":true,"stateful":false,"infrastructure":null,"qualityScore":70.4},{"id":"shader-effects-aurora","component":"Aurora","name":"Aurora","category":"Textures","description":"Mesmerizing aurora borealis with layered curtains, vertical rays, and flowing light.","requiresChild":false,"stateful":false,"infrastructure":null,"qualityScore":90},{"id":"shader-effects-barn-doors","component":"BarnDoors","name":"Barn Doors","category":"Transitions","description":"Split the content along a center line and wipe outward in both directions","requiresChild":true,"stateful":false,"infrastructure":null,"qualityScore":42.9},{"id":"shader-effects-bar-shift","component":"BarShift","name":"Bar Shift","category":"Distortions","description":"Slices content into parallel bars, each offset independently for a fractured or glitch-like effect","requiresChild":true,"stateful":false,"infrastructure":null,"qualityScore":55.4},{"id":"shader-effects-beam","component":"Beam","name":"Beam","category":"Textures","description":"A beam of light from one point to another.","requiresChild":false,"stateful":false,"infrastructure":null,"qualityScore":78},{"id":"shader-effects-bend","component":"Bend","name":"Bend","category":"Distortions","description":"Bends the ends of the frame toward you like a curved display — content at the edges swells closer under real perspective, or curls away when the strength goes negative","requiresChild":true,"stateful":false,"infrastructure":null,"qualityScore":52.8},{"id":"shader-effects-blob","component":"Blob","name":"Blob","category":"Textures","description":"Organic animated blob with 3D lighting and gradients","requiresChild":false,"stateful":false,"infrastructure":null,"qualityScore":85.3},{"id":"shader-effects-block-dissolve","component":"BlockDissolve","name":"Block Dissolve","category":"Transitions","description":"Dissolve the content away as a grid of blocks vanishing in random order","requiresChild":true,"stateful":false,"infrastructure":null,"qualityScore":43.7},{"id":"shader-effects-block-noise","component":"BlockNoise","name":"Block Noise","category":"Textures","description":"Blocky value noise with soft cells that morph over time","requiresChild":false,"stateful":false,"infrastructure":null,"qualityScore":61.2},{"id":"shader-effects-blue-noise","component":"BlueNoise","name":"Blue Noise","category":"Textures","description":"High-frequency blue noise — even, grainy speckle ideal for dithering","requiresChild":false,"stateful":false,"infrastructure":null,"qualityScore":61.1},{"id":"shader-effects-blur","component":"Blur","name":"Blur","category":"Blurs","description":"A simple Gaussian blur effect","requiresChild":true,"stateful":false,"infrastructure":null,"qualityScore":53.7},{"id":"shader-effects-boids","component":"Boids","name":"Boids","category":"Interactive","description":"A living murmuration of hundreds of flocking agents drawn as crisp arrows, streaks, dots or glowing comets — separation, alignment and cohesion drive fluid, splitting-and-merging ribbons, agents flash toward an excited color when scattered, and the cursor acts as an attractor or a predator","requiresChild":false,"stateful":true,"infrastructure":null,"qualityScore":78.1},{"id":"shader-effects-bokeh-blur","component":"BokehBlur","name":"Bokeh Blur","category":"Blurs","description":"Photographic lens blur where bright highlights bloom into aperture-shaped discs","requiresChild":true,"stateful":false,"infrastructure":null,"qualityScore":54.5},{"id":"shader-effects-brick-pattern","component":"BrickPattern","name":"Brick Pattern","category":"Textures","description":"Classic brick wall pattern with alternating rows and mortar gaps","requiresChild":false,"stateful":false,"infrastructure":null,"qualityScore":61.5},{"id":"shader-effects-brightness-contrast","component":"BrightnessContrast","name":"Brightness Contrast","category":"Adjustments","description":"Adjust brightness and contrast of the image","requiresChild":true,"stateful":false,"infrastructure":null,"qualityScore":32.8},{"id":"shader-effects-brushed-metal","component":"BrushedMetal","name":"Brushed Metal","category":"Shape Effects","description":"Photorealistic brushed metal — a satin anodised surface combed with fine directional grain that smears the reflected studio and key light into the long anisotropic streaks of real brushed aluminium, steel, gold or copper","requiresChild":false,"stateful":false,"infrastructure":null,"qualityScore":85.1},{"id":"shader-effects-bulge","component":"Bulge","name":"Bulge","category":"Distortions","description":"Magnify or pinch content around a center point","requiresChild":true,"stateful":false,"infrastructure":null,"qualityScore":55.6},{"id":"shader-effects-carbon-fiber","component":"CarbonFiber","name":"Carbon Fiber","category":"Shape Effects","description":"Photorealistic woven carbon fibre — interlaced tows whose anisotropic sheen flips ninety degrees cell to cell, raised into a quilted weave and finished with a glossy clearcoat that mirrors the studio. Plain or twill, in any shape.","requiresChild":false,"stateful":false,"infrastructure":null,"qualityScore":84.1},{"id":"shader-effects-chalkboard","component":"Chalkboard","name":"Chalkboard","category":"Stylize","description":"Renders content as a chalk drawing on a blackboard, with edge strokes and cross-hatch shading","requiresChild":true,"stateful":false,"infrastructure":null,"qualityScore":70.1},{"id":"shader-effects-channel-blur","component":"ChannelBlur","name":"Channel Blur","category":"Blurs","description":"Independent blur for red, green, and blue channels","requiresChild":true,"stateful":false,"infrastructure":null,"qualityScore":54},{"id":"shader-effects-checkerboard","component":"Checkerboard","name":"Checkerboard","category":"Textures","description":"Classic checkerboard pattern with two alternating colors","requiresChild":false,"stateful":false,"infrastructure":null,"qualityScore":52.4},{"id":"shader-effects-checker-wipe","component":"CheckerWipe","name":"Checker Wipe","category":"Transitions","description":"Wipe the content away as a checkerboard of fading squares","requiresChild":true,"stateful":false,"infrastructure":null,"qualityScore":43.1},{"id":"shader-effects-chevron","component":"Chevron","name":"Chevron","category":"Textures","description":"Animated chevron / zigzag stripe pattern","requiresChild":false,"stateful":false,"infrastructure":null,"qualityScore":61.4},{"id":"shader-effects-chroma-flow","component":"ChromaFlow","name":"Chroma Flow","category":"Interactive","description":"Interactive liquid flow effect that follows your cursor","requiresChild":false,"stateful":true,"infrastructure":null,"qualityScore":78.9},{"id":"shader-effects-chromatic-aberration","component":"ChromaticAberration","name":"Chromatic Aberration","category":"Stylize","description":"Separate RGB channels for a prismatic distortion effect","requiresChild":true,"stateful":false,"infrastructure":null,"qualityScore":63},{"id":"shader-effects-chrome","component":"Chrome","name":"Chrome","category":"Shape Effects","description":"Studio-lit mirror chrome — a precision-machined shape with a controllable polished bevel, softly convex faces and a photographic studio reflected in them: one huge frontal softbox, black flags, and thin warm/cool strip lights that fringe amber and ice-blue exactly where the reflections break","requiresChild":false,"stateful":false,"infrastructure":null,"qualityScore":89.8},{"id":"shader-effects-circle","component":"Circle","name":"Circle","category":"Shapes","description":"Generate a circle with adjustable size and softness","requiresChild":false,"stateful":false,"infrastructure":null,"qualityScore":23.3},{"id":"shader-effects-color-wheel","component":"ColorWheel","name":"Color Wheel","category":"Textures","description":"A directional gradient that smoothly cycles through rainbow colors or a custom set of three colors","requiresChild":false,"stateful":false,"infrastructure":null,"qualityScore":61.9},{"id":"shader-effects-compression-artifacts","component":"CompressionArtifacts","name":"Compression Artifacts","category":"Stylize","description":"Simulates lossy JPEG compression — 8×8 DCT block quantization, blockiness, ringing and color bleed","requiresChild":true,"stateful":false,"infrastructure":null,"qualityScore":54.7},{"id":"shader-effects-concentric-spin","component":"ConcentricSpin","name":"Concentric Spin","category":"Distortions","description":"Concentric rings that each rotate the underlying image by different amounts","requiresChild":true,"stateful":false,"infrastructure":null,"qualityScore":55.5},{"id":"shader-effects-conic-gradient","component":"ConicGradient","name":"Conic Gradient","category":"Textures","description":"Colors sweep in a full circle around a center point, like a color wheel","requiresChild":false,"stateful":false,"infrastructure":null,"qualityScore":79.7},{"id":"shader-effects-contour-lines","component":"ContourLines","name":"Contour Lines","category":"Stylize","description":"Draw topographical contour lines based on luminance or alpha","requiresChild":true,"stateful":false,"infrastructure":null,"qualityScore":63.3},{"id":"shader-effects-corner-pin","component":"CornerPin","name":"Corner Pin","category":"Distortions","description":"Pin each corner of the content to an arbitrary position for a free perspective warp","requiresChild":true,"stateful":false,"infrastructure":null,"qualityScore":52.5},{"id":"shader-effects-crescent","component":"Crescent","name":"Crescent","category":"Shapes","description":"Crescent moon shape — an outer circle with an inner circle subtracted","requiresChild":false,"stateful":false,"infrastructure":null,"qualityScore":23.4},{"id":"shader-effects-cross","component":"Cross","name":"Cross","category":"Shapes","description":"Plus / cross shape with adjustable arm length, width, and rounding","requiresChild":false,"stateful":false,"infrastructure":null,"qualityScore":23},{"id":"shader-effects-crtscreen","component":"CRTScreen","name":"CRTScreen","category":"Stylize","description":"Retro CRT monitor simulation with scanlines","requiresChild":true,"stateful":false,"infrastructure":null,"qualityScore":70},{"id":"shader-effects-crystal","component":"Crystal","name":"Crystal","category":"Shape Effects","description":"Diamond-like crystal lens with faceted refraction.","requiresChild":true,"stateful":false,"infrastructure":null,"qualityScore":77.9},{"id":"shader-effects-curl-noise","component":"CurlNoise","name":"Curl Noise","category":"Textures","description":"Swirling divergence-free flow field that drifts over time","requiresChild":false,"stateful":false,"infrastructure":null,"qualityScore":80},{"id":"shader-effects-cursor-ripples","component":"CursorRipples","name":"Cursor Ripples","category":"Interactive","description":"Fluid-like ripple distortion","requiresChild":true,"stateful":true,"infrastructure":null,"qualityScore":62.6},{"id":"shader-effects-cursor-trail","component":"CursorTrail","name":"Cursor Trail","category":"Interactive","description":"Animated trail effect that tracks cursor movement","requiresChild":false,"stateful":true,"infrastructure":null,"qualityScore":62.5},{"id":"shader-effects-data-mosh","component":"DataMosh","name":"Data Mosh","category":"Stylize","description":"Corrupted-codec motion smearing — macroblocks lock in place and drag their pixels across the frame in liquid trails, each recovering on its own clock, like a video stream that lost its keyframes","requiresChild":true,"stateful":false,"infrastructure":null,"qualityScore":62.4},{"id":"shader-effects-diamond-gradient","component":"DiamondGradient","name":"Diamond Gradient","category":"Textures","description":"Diamond-shaped gradient radiating from a center point using Manhattan distance","requiresChild":false,"stateful":false,"infrastructure":null,"qualityScore":71.5},{"id":"shader-effects-diamond-wipe","component":"DiamondWipe","name":"Diamond Wipe","category":"Transitions","description":"Wipe the content away through a lattice of growing diamonds","requiresChild":true,"stateful":false,"infrastructure":null,"qualityScore":43.6},{"id":"shader-effects-diffuse-blur","component":"DiffuseBlur","name":"Diffuse Blur","category":"Blurs","description":"Grain-like pixel displacement at random","requiresChild":true,"stateful":false,"infrastructure":null,"qualityScore":53.9},{"id":"shader-effects-displacement-map","component":"DisplacementMap","name":"Displacement Map","category":"Distortions","description":"Distorts child content using another layer's pixels as a displacement map","requiresChild":true,"stateful":false,"infrastructure":null,"qualityScore":53.1},{"id":"shader-effects-dither","component":"Dither","name":"Dither","category":"Stylize","description":"Dithering effect with multiple pattern options","requiresChild":true,"stateful":false,"infrastructure":null,"qualityScore":70.3},{"id":"shader-effects-dot-grid","component":"DotGrid","name":"Dot Grid","category":"Textures","description":"Grid of dots with optional twinkling animation","requiresChild":false,"stateful":false,"infrastructure":null,"qualityScore":61.6},{"id":"shader-effects-drop-shadow","component":"DropShadow","name":"Drop Shadow","category":"Stylize","description":"Adds a soft shadow behind the child content based on its alpha silhouette","requiresChild":true,"stateful":false,"infrastructure":null,"qualityScore":53.2},{"id":"shader-effects-duotone","component":"Duotone","name":"Duotone","category":"Adjustments","description":"Map colors to two tones based on luminance","requiresChild":true,"stateful":false,"infrastructure":null,"qualityScore":33.9},{"id":"shader-effects-ellipse","component":"Ellipse","name":"Ellipse","category":"Shapes","description":"Ellipse with independently adjustable horizontal and vertical radii","requiresChild":false,"stateful":false,"infrastructure":null,"qualityScore":23.2},{"id":"shader-effects-emboss","component":"Emboss","name":"Emboss","category":"Shape Effects","description":"Embossed / debossed relief shading on top of child content, driven by a custom shape","requiresChild":true,"stateful":false,"infrastructure":null,"qualityScore":69.6},{"id":"shader-effects-engraving","component":"Engraving","name":"Engraving","category":"Stylize","description":"Copper-plate line engraving — the image is redrawn as flowing line work whose weight swells with darkness, lines displaced by the form like a banknote portrait: a single plate, cross-hatched shadow plates, or one continuous spiral cut","requiresChild":true,"stateful":false,"infrastructure":null,"qualityScore":70.6},{"id":"shader-effects-erosion-noise","component":"ErosionNoise","name":"Erosion Noise","category":"Textures","description":"Branching, hydraulic-erosion ridges carved into noise","requiresChild":false,"stateful":false,"infrastructure":null,"qualityScore":78.5},{"id":"shader-effects-exposure","component":"Exposure","name":"Exposure","category":"Adjustments","description":"Multiplicative exposure (gain) on the child. Unlike additive brightness, it scales values around black — blacks stay black while highlights can be pushed past 1.0 to feed HDR bloom and tone-mapping roll-off. Pointwise, so no extra render pass is needed.","requiresChild":true,"stateful":false,"infrastructure":null,"qualityScore":32.9},{"id":"shader-effects-falling-lines","component":"FallingLines","name":"Falling Lines","category":"Textures","description":"Directional falling lines with a leading-to-trailing color fade","requiresChild":false,"stateful":false,"infrastructure":null,"qualityScore":78.7},{"id":"shader-effects-film-grain","component":"FilmGrain","name":"Film Grain","category":"Stylize","description":"Analog film grain texture overlay, weighted toward darker areas","requiresChild":true,"stateful":false,"infrastructure":null,"qualityScore":54.8},{"id":"shader-effects-film-stock","component":"FilmStock","name":"Film Stock","category":"Adjustments","description":"Real analog film color from measured film-emulation LUTs — ten classic stock looks with emulsion halation and projector gate weave","requiresChild":true,"stateful":false,"infrastructure":null,"qualityScore":34},{"id":"shader-effects-flip","component":"Flip","name":"Flip","category":"Distortions","description":"Mirror content horizontally, vertically, or both","requiresChild":true,"stateful":false,"infrastructure":null,"qualityScore":42.7},{"id":"shader-effects-floating-particles","component":"FloatingParticles","name":"Floating Particles","category":"Textures","description":"Drifting, twinkling motes — thousands of real simulated particles floating in a shared heading with per-particle wander and variance, and a cursor that stirs the field with a gust that settles back into the drift","requiresChild":false,"stateful":false,"infrastructure":null,"qualityScore":78.8},{"id":"shader-effects-flower","component":"Flower","name":"Flower","category":"Shapes","description":"Petal shape with N lobes and adjustable inner-to-outer radius ratio","requiresChild":false,"stateful":false,"infrastructure":null,"qualityScore":24},{"id":"shader-effects-flow-field","component":"FlowField","name":"Flow Field","category":"Distortions","description":"Fluid-like distortion with constant smooth motion","requiresChild":true,"stateful":false,"infrastructure":null,"qualityScore":55.7},{"id":"shader-effects-flowing-gradient","component":"FlowingGradient","name":"Flowing Gradient","category":"Textures","description":"Liquid silk gradient with organic flowing color bands","requiresChild":false,"stateful":false,"infrastructure":null,"qualityScore":89.1},{"id":"shader-effects-fluted-glass","component":"FlutedGlass","name":"Fluted Glass","category":"Distortions","description":"Full-screen fluted glass effect — refracts content through repeating cylindrical bars","requiresChild":true,"stateful":false,"infrastructure":null,"qualityScore":63.8},{"id":"shader-effects-fog","component":"Fog","name":"Fog","category":"Interactive","description":"Fog that fills the screen and interacts with the mouse","requiresChild":false,"stateful":true,"infrastructure":null,"qualityScore":78.4},{"id":"shader-effects-form3-d","component":"Form3D","name":"Form3 D","category":"Distortions","description":"Wraps child content onto a 3D raymarched shape with lighting.","requiresChild":true,"stateful":false,"infrastructure":null,"qualityScore":63.5},{"id":"shader-effects-fractal-noise","component":"FractalNoise","name":"Fractal Noise","category":"Textures","description":"Multi-octave fractal Brownian motion noise texture with true noise evolution","requiresChild":false,"stateful":false,"infrastructure":null,"qualityScore":78.6},{"id":"shader-effects-frost","component":"Frost","name":"Frost","category":"Shape Effects","description":"Photoreal frozen ice — thickness-driven subsurface scattering that reads as a solid block, with fine frost crystals creeping in from the edges","requiresChild":false,"stateful":false,"infrastructure":null,"qualityScore":84.9},{"id":"shader-effects-gabor-noise","component":"GaborNoise","name":"Gabor Noise","category":"Textures","description":"Oriented sine-grain noise with a fingerprint-like flow","requiresChild":false,"stateful":false,"infrastructure":null,"qualityScore":71.6},{"id":"shader-effects-glass","component":"Glass","name":"Glass","category":"Shape Effects","description":"Optically realistic glass lens driven in a custom shape","requiresChild":true,"stateful":false,"infrastructure":null,"qualityScore":85.2},{"id":"shader-effects-glass-tiles","component":"GlassTiles","name":"Glass Tiles","category":"Distortions","description":"Refraction-like distortion in a tile grid pattern","requiresChild":true,"stateful":false,"infrastructure":null,"qualityScore":63.7},{"id":"shader-effects-glitch","component":"Glitch","name":"Glitch","category":"Stylize","description":"Digital glitch that melts pixels and distorts colors","requiresChild":true,"stateful":false,"infrastructure":null,"qualityScore":63.9},{"id":"shader-effects-glow","component":"Glow","name":"Glow","category":"Stylize","description":"Soft glow effect with adjustable intensity","requiresChild":true,"stateful":false,"infrastructure":null,"qualityScore":63.2},{"id":"shader-effects-godrays","component":"Godrays","name":"Godrays","category":"Textures","description":"Volumetric light rays emanating from a point","requiresChild":false,"stateful":false,"infrastructure":null,"qualityScore":89.6},{"id":"shader-effects-goo","component":"Goo","name":"Goo","category":"Shape Effects","description":"Photoreal wet liquid — animated 3D metaball blobs that merge and bulge to loosely form the shape, with sliding wet highlights, a clearcoat rim and a translucent body","requiresChild":false,"stateful":false,"infrastructure":null,"qualityScore":84.7},{"id":"shader-effects-gradient-map","component":"GradientMap","name":"Gradient Map","category":"Stylize","description":"Maps source luminance through an animated color gradient (Photoshop-style gradient map)","requiresChild":true,"stateful":false,"infrastructure":null,"qualityScore":70.2},{"id":"shader-effects-grayscale","component":"Grayscale","name":"Grayscale","category":"Adjustments","description":"Convert colors to black and white","requiresChild":true,"stateful":false,"infrastructure":null,"qualityScore":33.3},{"id":"shader-effects-grid","component":"Grid","name":"Grid","category":"Textures","description":"Simple grid lines pattern with adjustable thickness and rotation","requiresChild":false,"stateful":false,"infrastructure":null,"qualityScore":52.3},{"id":"shader-effects-grid-distortion","component":"GridDistortion","name":"Grid Distortion","category":"Interactive","description":"Interactive grid distortion controlled by mouse position","requiresChild":true,"stateful":true,"infrastructure":null,"qualityScore":55.1},{"id":"shader-effects-group","component":"Group","name":"Group","category":"Utilities","description":"Container for organizing and composing child effects — supports flex-like flow layout (column/row stacking via the flow prop)","requiresChild":true,"stateful":false,"infrastructure":"Use Design Lab layer groups to compose effects.","qualityScore":0},{"id":"shader-effects-halftone","component":"Halftone","name":"Halftone","category":"Stylize","description":"Halftone dot pattern effect for printing aesthetics","requiresChild":true,"stateful":false,"infrastructure":null,"qualityScore":70.5},{"id":"shader-effects-heart","component":"Heart","name":"Heart","category":"Shapes","description":"Heart shape with adjustable size","requiresChild":false,"stateful":false,"infrastructure":null,"qualityScore":23.6},{"id":"shader-effects-heatmap","component":"Heatmap","name":"Heatmap","category":"Shape Effects","description":"Thermal-camera heat flowing through any 2D, SVG, or 3D shape. Powered by Paper Shaders.","requiresChild":false,"stateful":false,"infrastructure":null,"qualityScore":84},{"id":"shader-effects-hex-grid","component":"HexGrid","name":"Hex Grid","category":"Textures","description":"Honeycomb hexagonal grid pattern","requiresChild":false,"stateful":false,"infrastructure":null,"qualityScore":61.7},{"id":"shader-effects-hologram","component":"Hologram","name":"Hologram","category":"Shape Effects","description":"Volumetric sci-fi hologram — a translucent emissive projection of the shape with fresnel-lit edges, depth scan-lines that wrap 3D forms, CRT scanlines, flicker and beam wobble","requiresChild":false,"stateful":false,"infrastructure":null,"qualityScore":85},{"id":"shader-effects-holographic","component":"Holographic","name":"Holographic","category":"Shape Effects","description":"Iridescent holographic foil sticker with animated rainbow sheen and glitter flakes","requiresChild":false,"stateful":false,"infrastructure":null,"qualityScore":89.7},{"id":"shader-effects-htmlin-canvas","component":"HTMLInCanvas","name":"HTMLIn Canvas","category":"Textures","description":"Render live HTML/DOM content as a WebGPU texture layer via the html-in-canvas API. Requires Chrome Canary with chrome://flags/#canvas-draw-element enabled.","requiresChild":false,"stateful":false,"infrastructure":"Experimental Chrome-only DOM capture; use Design Lab text and image layers.","qualityScore":0},{"id":"shader-effects-hue-shift","component":"HueShift","name":"Hue Shift","category":"Adjustments","description":"Rotate hue around the color wheel","requiresChild":true,"stateful":false,"infrastructure":null,"qualityScore":33.2},{"id":"shader-effects-image-texture","component":"ImageTexture","name":"Image Texture","category":"Textures","description":"Display an image with customizable object-fit modes","requiresChild":false,"stateful":false,"infrastructure":null,"qualityScore":52.1},{"id":"shader-effects-ink-flow","component":"InkFlow","name":"Ink Flow","category":"Interactive","description":"Drag to paint swirling ribbons of ink through a real fluid field — eddies keep evolving after you let go","requiresChild":false,"stateful":true,"infrastructure":null,"qualityScore":79.3},{"id":"shader-effects-invert","component":"Invert","name":"Invert","category":"Adjustments","description":"Invert RGB colors while preserving alpha","requiresChild":true,"stateful":false,"infrastructure":null,"qualityScore":33.4},{"id":"shader-effects-iris-wipe","component":"IrisWipe","name":"Iris Wipe","category":"Transitions","description":"Reveal through an expanding circle growing from a center point","requiresChild":true,"stateful":false,"infrastructure":null,"qualityScore":43.5},{"id":"shader-effects-irradiance","component":"Irradiance","name":"Irradiance","category":"Shape Effects","description":"Photorealistic light spilling around the edge of any 2D, SVG, or 3D shape — any number of movable colored point lights strike the silhouette and the lit edges irradiate their surroundings, gathered in a compute pass with real cast shadows, mixing where they meet and burning to white at the rim","requiresChild":false,"stateful":false,"infrastructure":null,"qualityScore":85.7},{"id":"shader-effects-isometric-cubes","component":"IsometricCubes","name":"Isometric Cubes","category":"Textures","description":"Isometric tumbling-blocks tiling — a 3D cube illusion (rhombille pattern)","requiresChild":false,"stateful":false,"infrastructure":null,"qualityScore":71.2},{"id":"shader-effects-kaleidoscope","component":"Kaleidoscope","name":"Kaleidoscope","category":"Distortions","description":"Create a kaleidoscope effect with radial mirrored segments","requiresChild":true,"stateful":false,"infrastructure":null,"qualityScore":63.6},{"id":"shader-effects-key-frames","component":"KeyFrames","name":"Key Frames","category":"Stylize","description":"Motion-tracking overlay — trackers hunt and follow features in the content, dropping keyframe diamonds behind them along their motion paths, like a compositor mid-track","requiresChild":true,"stateful":true,"infrastructure":null,"qualityScore":53.5},{"id":"shader-effects-lens-distortion","component":"LensDistortion","name":"Lens Distortion","category":"Stylize","description":"Split content into shifting chromatic layers with barrel or pincushion lens warp. Powered by Paper Shaders.","requiresChild":true,"stateful":false,"infrastructure":null,"qualityScore":62.9},{"id":"shader-effects-lens-flare","component":"LensFlare","name":"Lens Flare","category":"Stylize","description":"Realistic camera lens flare with artifacts.","requiresChild":false,"stateful":false,"infrastructure":null,"qualityScore":84.4},{"id":"shader-effects-light-edge","component":"LightEdge","name":"Light Edge","category":"Shape Effects","description":"Glowing, pulsing light racing around the edge of any 2D, SVG, or 3D shape. Powered by Paper Shaders.","requiresChild":false,"stateful":false,"infrastructure":null,"qualityScore":85.9},{"id":"shader-effects-light-leak","component":"LightLeak","name":"Light Leak","category":"Stylize","description":"Photorealistic film light leak — warm overexposed light bleeding in from a draggable anchor point, with streak bands, chromatic fringing, and slow breathing that evolves over time","requiresChild":true,"stateful":false,"infrastructure":null,"qualityScore":69.8},{"id":"shader-effects-line","component":"Line","name":"Line","category":"Shapes","description":"Draw a straight line between two points with color, thickness, and solid, dashed, or dotted styles","requiresChild":false,"stateful":false,"infrastructure":null,"qualityScore":22.5},{"id":"shader-effects-linear-blur","component":"LinearBlur","name":"Linear Blur","category":"Blurs","description":"Directional motion blur in a specific angle","requiresChild":true,"stateful":false,"infrastructure":null,"qualityScore":53.8},{"id":"shader-effects-linear-gradient","component":"LinearGradient","name":"Linear Gradient","category":"Textures","description":"Create smooth linear color gradients","requiresChild":false,"stateful":false,"infrastructure":null,"qualityScore":71.4},{"id":"shader-effects-linear-wipe","component":"LinearWipe","name":"Linear Wipe","category":"Transitions","description":"Wipe the content away along a straight edge with a soft feathered transition","requiresChild":true,"stateful":false,"infrastructure":null,"qualityScore":42.8},{"id":"shader-effects-liquid-metal","component":"LiquidMetal","name":"Liquid Metal","category":"Shape Effects","description":"Flowing liquid chrome — a molten reflective surface that wraps the shape, sweeping a procedural studio reflection across animated folds with crisp speculars and prismatic edges","requiresChild":false,"stateful":false,"infrastructure":null,"qualityScore":89.9},{"id":"shader-effects-liquify","component":"Liquify","name":"Liquify","category":"Interactive","description":"Liquid-like interactive deformation effect","requiresChild":true,"stateful":true,"infrastructure":null,"qualityScore":55},{"id":"shader-effects-magnetic-filings","component":"MagneticFilings","name":"Magnetic Filings","category":"Interactive","description":"Thousands of tiny iron filings scattered on paper that swing to align with a magnetic field around the cursor, tracing out the field lines — a dipole whose axis follows the cursor's motion draws the classic two-lobed swirl, and every sweep of the magnet sends a glowing wave of filings flipping and settling","requiresChild":false,"stateful":true,"infrastructure":null,"qualityScore":78.2},{"id":"shader-effects-marble","component":"Marble","name":"Marble","category":"Textures","description":"Classic marble swirl and vein texture using noise-warped sine waves","requiresChild":false,"stateful":false,"infrastructure":null,"qualityScore":85.5},{"id":"shader-effects-mesh-gradient","component":"MeshGradient","name":"Mesh Gradient","category":"Textures","description":"Flowing mesh gradient of soft drifting color swaths whose seams wrap through the palette","requiresChild":false,"stateful":false,"infrastructure":null,"qualityScore":89.4},{"id":"shader-effects-mirror","component":"Mirror","name":"Mirror","category":"Distortions","description":"Mirror content across a line defined by center point and angle","requiresChild":true,"stateful":false,"infrastructure":null,"qualityScore":52.9},{"id":"shader-effects-multi-point-gradient","component":"MultiPointGradient","name":"Multi Point Gradient","category":"Textures","description":"Five individually placed color points blended together by proximity — drag each point to shape the gradient","requiresChild":false,"stateful":false,"infrastructure":null,"qualityScore":84.6},{"id":"shader-effects-nebula","component":"Nebula","name":"Nebula","category":"Shape Effects","description":"A volumetric gas nebula sealed inside polished glass; billowing emission clouds with hollow dark cavities and hot glowing cores, star fields drifting at real depth behind the gas, all refracted through the curved walls of the shape and dressed with studio reflections","requiresChild":false,"stateful":false,"infrastructure":null,"qualityScore":89.3},{"id":"shader-effects-neon","component":"Neon","name":"Neon","category":"Shape Effects","description":"Photorealistic neon tube / 3D pipe effect driven by a custom shape","requiresChild":false,"stateful":false,"infrastructure":null,"qualityScore":85.8},{"id":"shader-effects-noise-dissolve","component":"NoiseDissolve","name":"Noise Dissolve","category":"Transitions","description":"Dissolve the content away through an organic noise pattern","requiresChild":true,"stateful":false,"infrastructure":null,"qualityScore":43.8},{"id":"shader-effects-object-tracker","component":"ObjectTracker","name":"Object Tracker","category":"Stylize","description":"Computer-vision style object detection overlay — draws bounding boxes and labels around detected regions of the content below, with grid, quadtree and mosaic layouts.","requiresChild":true,"stateful":false,"infrastructure":null,"qualityScore":53.6},{"id":"shader-effects-obsidian","component":"Obsidian","name":"Obsidian","category":"Shape Effects","description":"Dark tinted glass whose faces stay near-black while every surface turning away from the viewer ignites with a flowing iridescent gradient — vivid color living only on the oblique walls and bevels","requiresChild":false,"stateful":false,"infrastructure":null,"qualityScore":86},{"id":"shader-effects-page-peel","component":"PagePeel","name":"Page Peel","category":"Transitions","description":"Curl the content up from a corner like a peeling page","requiresChild":true,"stateful":false,"infrastructure":null,"qualityScore":44},{"id":"shader-effects-paper","component":"Paper","name":"Paper","category":"Stylize","description":"Applies realistic paper grain and surface roughness to child content","requiresChild":true,"stateful":false,"infrastructure":null,"qualityScore":62.3},{"id":"shader-effects-parallelogram","component":"Parallelogram","name":"Parallelogram","category":"Shapes","description":"Parallelogram with adjustable width, height and skew","requiresChild":false,"stateful":false,"infrastructure":null,"qualityScore":22.7},{"id":"shader-effects-particle-field","component":"ParticleField","name":"Particle Field","category":"Stylize","description":"Explodes the child content into a breathing 3D field of particles — bright areas float toward you and dark areas recede, the whole relief can be orbited with the camera rotations, and the cursor physically throws particles that spring back home","requiresChild":true,"stateful":true,"infrastructure":null,"qualityScore":69.7},{"id":"shader-effects-particle-flow","component":"ParticleFlow","name":"Particle Flow","category":"Interactive","description":"Thousands of drifting dust particles carried by a real incompressible fluid field the cursor stirs — drag to plow a wake and the particles ride the eddies and vortices it leaves behind, while a gentle ambient breeze keeps the whole scene breathing on its own","requiresChild":false,"stateful":true,"infrastructure":null,"qualityScore":78.3},{"id":"shader-effects-particles","component":"Particles","name":"Particles","category":"Shape Effects","description":"A swarm of simulated particles that settles into the shape, filling it evenly — flat, SVG or true 3D volumes — scattering from the cursor (or chasing it), tumbling when the shape moves, and always drifting back home","requiresChild":false,"stateful":true,"infrastructure":null,"qualityScore":79.4},{"id":"shader-effects-perlin-noise","component":"PerlinNoise","name":"Perlin Noise","category":"Textures","description":"Smooth gradient noise that morphs over time","requiresChild":false,"stateful":false,"infrastructure":null,"qualityScore":71.9},{"id":"shader-effects-perspective","component":"Perspective","name":"Perspective","category":"Distortions","description":"Rotate the plane in 3D space with pan and tilt","requiresChild":true,"stateful":false,"infrastructure":null,"qualityScore":52.6},{"id":"shader-effects-pixelate","component":"Pixelate","name":"Pixelate","category":"Stylize","description":"Pixelation effect with adjustable cell size","requiresChild":true,"stateful":false,"infrastructure":null,"qualityScore":62},{"id":"shader-effects-pixel-sort","component":"PixelSort","name":"Pixel Sort","category":"Interactive","description":"Pixels sort by brightness around the cursor and keep their sorted position, optionally decaying back over time","requiresChild":true,"stateful":true,"infrastructure":null,"qualityScore":62.7},{"id":"shader-effects-pixel-throw","component":"PixelThrow","name":"Pixel Throw","category":"Interactive","description":"Throws pixels along the cursor's path like a fluid — brighter (or redder/greener/bluer) pixels are flung farther, then settle back with friction","requiresChild":true,"stateful":true,"infrastructure":null,"qualityScore":54.9},{"id":"shader-effects-plasma","component":"Plasma","name":"Plasma","category":"Textures","description":"Animated effect of glowing plasma","requiresChild":false,"stateful":false,"infrastructure":null,"qualityScore":89.5},{"id":"shader-effects-plastic","component":"Plastic","name":"Plastic","category":"Shape Effects","description":"Glossy molded plastic with photorealistic studio reflections, driven in a custom shape","requiresChild":false,"stateful":false,"infrastructure":null,"qualityScore":84.8},{"id":"shader-effects-polar-coordinates","component":"PolarCoordinates","name":"Polar Coordinates","category":"Distortions","description":"Convert rectangular coordinates to polar space","requiresChild":true,"stateful":false,"infrastructure":null,"qualityScore":55.3},{"id":"shader-effects-polygon","component":"Polygon","name":"Polygon","category":"Shapes","description":"Regular polygon with adjustable sides and corner rounding","requiresChild":false,"stateful":false,"infrastructure":null,"qualityScore":23.7},{"id":"shader-effects-posterize","component":"Posterize","name":"Posterize","category":"Adjustments","description":"Reduce color depth to create a poster effect","requiresChild":true,"stateful":false,"infrastructure":null,"qualityScore":33.7},{"id":"shader-effects-prism","component":"Prism","name":"Prism","category":"Textures","description":"A beam of light that fans out and splits into a slowly-rotating rainbow past a controllable point. Transparent background — composite over a dark layer.","requiresChild":false,"stateful":false,"infrastructure":null,"qualityScore":89},{"id":"shader-effects-progressive-blur","component":"ProgressiveBlur","name":"Progressive Blur","category":"Blurs","description":"Blur that increases progressively in one direction","requiresChild":true,"stateful":false,"infrastructure":null,"qualityScore":54.4},{"id":"shader-effects-radial-gradient","component":"RadialGradient","name":"Radial Gradient","category":"Textures","description":"Radial gradient radiating from a center point","requiresChild":false,"stateful":false,"infrastructure":null,"qualityScore":71.3},{"id":"shader-effects-radial-wipe","component":"RadialWipe","name":"Radial Wipe","category":"Transitions","description":"Sweep the content away in a clock-hand arc around a center point","requiresChild":true,"stateful":false,"infrastructure":null,"qualityScore":43.4},{"id":"shader-effects-random-bars","component":"RandomBars","name":"Random Bars","category":"Transitions","description":"Wipe the content away as parallel bars vanishing in random order","requiresChild":true,"stateful":false,"infrastructure":null,"qualityScore":43},{"id":"shader-effects-reaction-diffusion","component":"ReactionDiffusion","name":"Reaction Diffusion","category":"Interactive","description":"A living Gray-Scott reaction-diffusion pattern that fills the layer and blooms wherever you drag the cursor","requiresChild":false,"stateful":true,"infrastructure":null,"qualityScore":79},{"id":"shader-effects-rectangular-coordinates","component":"RectangularCoordinates","name":"Rectangular Coordinates","category":"Distortions","description":"Convert polar coordinates back to rectangular space","requiresChild":true,"stateful":false,"infrastructure":null,"qualityScore":53},{"id":"shader-effects-reflective-plane","component":"ReflectivePlane","name":"Reflective Plane","category":"Stylize","description":"Reflective floor that mirrors the content above it","requiresChild":true,"stateful":false,"infrastructure":null,"qualityScore":54.6},{"id":"shader-effects-repeater","component":"Repeater","name":"Repeater","category":"Distortions","description":"Repeat the child content in grid, radial or linear layouts with per-instance variation","requiresChild":true,"stateful":false,"infrastructure":null,"qualityScore":55.2},{"id":"shader-effects-ring","component":"Ring","name":"Ring","category":"Shapes","description":"Annular ring (donut) with adjustable radius and band thickness","requiresChild":false,"stateful":false,"infrastructure":null,"qualityScore":23.8},{"id":"shader-effects-ripples","component":"Ripples","name":"Ripples","category":"Textures","description":"Concentric animated ripples emanating from a point","requiresChild":false,"stateful":false,"infrastructure":null,"qualityScore":79.8},{"id":"shader-effects-ripple-wipe","component":"RippleWipe","name":"Ripple Wipe","category":"Transitions","description":"Wipe the content away in concentric rings pulsing out from a center point","requiresChild":true,"stateful":false,"infrastructure":null,"qualityScore":43.9},{"id":"shader-effects-rounded-rect","component":"RoundedRect","name":"Rounded Rect","category":"Shapes","description":"Rounded rectangle with adjustable width, height, and corner rounding","requiresChild":false,"stateful":false,"infrastructure":null,"qualityScore":23.1},{"id":"shader-effects-saturation","component":"Saturation","name":"Saturation","category":"Adjustments","description":"Adjust color saturation intensity","requiresChild":true,"stateful":false,"infrastructure":null,"qualityScore":33.1},{"id":"shader-effects-scratches","component":"Scratches","name":"Scratches","category":"Textures","description":"Fine hairline scratches, like a worn film or scratched surface","requiresChild":false,"stateful":false,"infrastructure":null,"qualityScore":70.8},{"id":"shader-effects-sharpness","component":"Sharpness","name":"Sharpness","category":"Adjustments","description":"Adjust image sharpness using a convolution kernel","requiresChild":true,"stateful":false,"infrastructure":null,"qualityScore":32.7},{"id":"shader-effects-shatter","component":"Shatter","name":"Shatter","category":"Interactive","description":"Broken glass effect with tectonic plate displacement","requiresChild":true,"stateful":true,"infrastructure":null,"qualityScore":62.8},{"id":"shader-effects-simplex-noise","component":"SimplexNoise","name":"Simplex Noise","category":"Textures","description":"Organic noise with animated movement","requiresChild":false,"stateful":false,"infrastructure":null,"qualityScore":72},{"id":"shader-effects-sine-wave","component":"SineWave","name":"Sine Wave","category":"Textures","description":"Animated wave with thickness and softness","requiresChild":false,"stateful":false,"infrastructure":null,"qualityScore":70.7},{"id":"shader-effects-slice-wipe","component":"SliceWipe","name":"Slice Wipe","category":"Transitions","description":"Slice the content into strips that slide away in alternating directions","requiresChild":true,"stateful":false,"infrastructure":null,"qualityScore":43.2},{"id":"shader-effects-smoke","component":"Smoke","name":"Smoke","category":"Interactive","description":"Realistic fluid smoke simulation with vorticity dynamics","requiresChild":false,"stateful":true,"infrastructure":null,"qualityScore":79.2},{"id":"shader-effects-smoke-fill","component":"SmokeFill","name":"Smoke Fill","category":"Shape Effects","description":"Fill a shape with swirling fluid smoke that interacts with the shape boundary","requiresChild":false,"stateful":true,"infrastructure":null,"qualityScore":79.5},{"id":"shader-effects-smoke-flow","component":"SmokeFlow","name":"Smoke Flow","category":"Interactive","description":"Cursor-driven smoke that lingers, swirls, and dissipates with fluid dynamics","requiresChild":false,"stateful":true,"infrastructure":null,"qualityScore":79.1},{"id":"shader-effects-solarize","component":"Solarize","name":"Solarize","category":"Adjustments","description":"Inverts tones above a luminance threshold — a classic darkroom and photo effect","requiresChild":true,"stateful":false,"infrastructure":null,"qualityScore":33.6},{"id":"shader-effects-solid-color","component":"SolidColor","name":"Solid Color","category":"Textures","description":"Fill the canvas with a single solid color","requiresChild":false,"stateful":false,"infrastructure":null,"qualityScore":32.6},{"id":"shader-effects-sparkle","component":"Sparkle","name":"Sparkle","category":"Stylize","description":"Twinkling star glints over the bright parts of the layer inside","requiresChild":true,"stateful":false,"infrastructure":null,"qualityScore":63.1},{"id":"shader-effects-spherize","component":"Spherize","name":"Spherize","category":"Distortions","description":"Map content onto a 3D sphere surface with depth distortion","requiresChild":true,"stateful":false,"infrastructure":null,"qualityScore":56},{"id":"shader-effects-spiral","component":"Spiral","name":"Spiral","category":"Textures","description":"Rotating spiral pattern with animated movement","requiresChild":false,"stateful":false,"infrastructure":null,"qualityScore":70.9},{"id":"shader-effects-star","component":"Star","name":"Star","category":"Shapes","description":"Classic star polygon with straight sides and sharp pointed tips","requiresChild":false,"stateful":false,"infrastructure":null,"qualityScore":23.9},{"id":"shader-effects-stone","component":"Stone","name":"Stone","category":"Stylize","description":"Applies a marbled stone relief and surface distortion to child content","requiresChild":true,"stateful":false,"infrastructure":null,"qualityScore":62.2},{"id":"shader-effects-strands","component":"Strands","name":"Strands","category":"Textures","description":"Flowing ribbons of light with a multi-color gradient","requiresChild":false,"stateful":false,"infrastructure":null,"qualityScore":88.9},{"id":"shader-effects-stretch","component":"Stretch","name":"Stretch","category":"Distortions","description":"Stretch content towards a direction from a center point","requiresChild":true,"stateful":false,"infrastructure":null,"qualityScore":52.7},{"id":"shader-effects-stripes","component":"Stripes","name":"Stripes","category":"Textures","description":"Alternating colored stripes with animation","requiresChild":false,"stateful":false,"infrastructure":null,"qualityScore":61.3},{"id":"shader-effects-studio-background","component":"StudioBackground","name":"Studio Background","category":"Textures","description":"Multi-light studio background with ambient motion.","requiresChild":false,"stateful":false,"infrastructure":null,"qualityScore":84.3},{"id":"shader-effects-sun-burst","component":"SunBurst","name":"Sun Burst","category":"Textures","description":"Radial sunburst rays emanating from a center point","requiresChild":false,"stateful":false,"infrastructure":null,"qualityScore":84.2},{"id":"shader-effects-surface3-d","component":"Surface3D","name":"Surface3 D","category":"Distortions","description":"Drapes child content over a 3D wave surface with perspective and lighting","requiresChild":true,"stateful":false,"infrastructure":null,"qualityScore":63.4},{"id":"shader-effects-swirl","component":"Swirl","name":"Swirl","category":"Textures","description":"Flowing swirl pattern with multi-layered noise","requiresChild":false,"stateful":false,"infrastructure":null,"qualityScore":85.4},{"id":"shader-effects-teardrop","component":"Teardrop","name":"Teardrop","category":"Shapes","description":"Teardrop — a rounded bulb tapering to a sharp point","requiresChild":false,"stateful":false,"infrastructure":null,"qualityScore":22.9},{"id":"shader-effects-text","component":"Text","name":"Text","category":"Textures","description":"Text with any Google font — multi-line with wrapping, alignment and line height — rendered crisp via a glyph texture","requiresChild":false,"stateful":false,"infrastructure":null,"qualityScore":52.2},{"id":"shader-effects-thin-film","component":"ThinFilm","name":"Thin Film","category":"Shape Effects","description":"Iridescent thin-film edge","requiresChild":false,"stateful":false,"infrastructure":null,"qualityScore":89.2},{"id":"shader-effects-tilt-shift","component":"TiltShift","name":"Tilt Shift","category":"Blurs","description":"Selective focus blur mimicking tilt-shift photography","requiresChild":true,"stateful":false,"infrastructure":null,"qualityScore":54.3},{"id":"shader-effects-time-trail","component":"TimeTrail","name":"Time Trail","category":"Stylize","description":"An Echo-style temporal trail — whatever moves sheds a smooth, decaying long-exposure ghost trail (frame-difference Motion mode works on opaque images and video; Alpha mode trails a shape's coverage), with optional zoom-feedback tunnels and rainbow light-painting","requiresChild":true,"stateful":true,"infrastructure":null,"qualityScore":53.4},{"id":"shader-effects-tint","component":"Tint","name":"Tint","category":"Adjustments","description":"Apply a color tint to the image","requiresChild":true,"stateful":false,"infrastructure":null,"qualityScore":33.5},{"id":"shader-effects-trapezoid","component":"Trapezoid","name":"Trapezoid","category":"Shapes","description":"Trapezoid with adjustable top and bottom widths and height","requiresChild":false,"stateful":false,"infrastructure":null,"qualityScore":22.6},{"id":"shader-effects-triangular-grid","component":"TriangularGrid","name":"Triangular Grid","category":"Textures","description":"Tiling grid of equilateral triangles with optional animated row offsets","requiresChild":false,"stateful":false,"infrastructure":null,"qualityScore":61.8},{"id":"shader-effects-tritone","component":"Tritone","name":"Tritone","category":"Adjustments","description":"Map colors to three tones: shadows, midtones, highlights","requiresChild":true,"stateful":false,"infrastructure":null,"qualityScore":33.8},{"id":"shader-effects-truchet","component":"Truchet","name":"Truchet","category":"Textures","description":"Quarter-circle arc tiles that connect to form organic, maze-like flowing curves","requiresChild":false,"stateful":false,"infrastructure":null,"qualityScore":71.1},{"id":"shader-effects-twirl","component":"Twirl","name":"Twirl","category":"Distortions","description":"Rotate and twist content around a center point","requiresChild":true,"stateful":false,"infrastructure":null,"qualityScore":55.9},{"id":"shader-effects-venetian-blinds","component":"VenetianBlinds","name":"Venetian Blinds","category":"Transitions","description":"Wipe the content away behind a set of parallel closing strips","requiresChild":true,"stateful":false,"infrastructure":null,"qualityScore":43.3},{"id":"shader-effects-vesica","component":"Vesica","name":"Vesica","category":"Shapes","description":"Vesica piscis (lens shape) formed by the intersection of two overlapping circles","requiresChild":false,"stateful":false,"infrastructure":null,"qualityScore":22.8},{"id":"shader-effects-vhs","component":"VHS","name":"VHS","category":"Stylize","description":"Analog VHS tape with intermittent tape damage, chroma bleed, and per-scanline noise","requiresChild":true,"stateful":false,"infrastructure":null,"qualityScore":64},{"id":"shader-effects-vibrance","component":"Vibrance","name":"Vibrance","category":"Adjustments","description":"Selective saturation adjustment protecting skin tones","requiresChild":true,"stateful":false,"infrastructure":null,"qualityScore":33},{"id":"shader-effects-video-texture","component":"VideoTexture","name":"Video Texture","category":"Textures","description":"Display a video with customizable playback and object-fit modes","requiresChild":false,"stateful":false,"infrastructure":"Video input is a media source, not a standalone material.","qualityScore":0},{"id":"shader-effects-vignette","component":"Vignette","name":"Vignette","category":"Stylize","description":"Darkens or tints the edges of the frame, drawing attention toward the center","requiresChild":true,"stateful":false,"infrastructure":null,"qualityScore":53.3},{"id":"shader-effects-voronoi","component":"Voronoi","name":"Voronoi","category":"Textures","description":"Cellular pattern where each pixel is colored by its distance to the nearest of many scattered points","requiresChild":false,"stateful":false,"infrastructure":null,"qualityScore":79.9},{"id":"shader-effects-voxels","component":"Voxels","name":"Voxels","category":"Shape Effects","description":"Rebuild any shape out of voxels — a flat shape becomes chunky pixel art, a 3D shape a lit voxel model with smooth ambient occlusion, cast shadows, a key light you can orbit or drive, and per-cube color","requiresChild":false,"stateful":false,"infrastructure":null,"qualityScore":79.6},{"id":"shader-effects-water","component":"Water","name":"Water","category":"Shape Effects","description":"Translucent water — a refractive, light-absorbing body that deepens to its color with thickness, wrapped in a wind-driven wave surface that reflects a procedural sky, with Fresnel-bright grazing edges and foam breaking on the crests and shoreline","requiresChild":false,"stateful":false,"infrastructure":null,"qualityScore":85.6},{"id":"shader-effects-watercolor","component":"Watercolor","name":"Watercolor","category":"Stylize","description":"Painterly watercolor look — Kuwahara flattening, pigment edge darkening, paper grain and bleeding","requiresChild":true,"stateful":false,"infrastructure":null,"qualityScore":69.9},{"id":"shader-effects-wave-distortion","component":"WaveDistortion","name":"Wave Distortion","category":"Distortions","description":"Wave-based distortion with multiple waveform types","requiresChild":true,"stateful":false,"infrastructure":null,"qualityScore":55.8},{"id":"shader-effects-waveform","component":"Waveform","name":"Waveform","category":"Textures","description":"Audio-visualizer waveform — equalizer bars, a filled wave, an oscilloscope line, or a dot matrix — driven by a simulated signal whose amplitude you can map to your own audio level","requiresChild":false,"stateful":false,"infrastructure":null,"qualityScore":84.5},{"id":"shader-effects-wavelet-noise","component":"WaveletNoise","name":"Wavelet Noise","category":"Textures","description":"Rotating banded wavelets that ripple as they animate","requiresChild":false,"stateful":false,"infrastructure":null,"qualityScore":71.7},{"id":"shader-effects-weave","component":"Weave","name":"Weave","category":"Textures","description":"Interlaced textile weave pattern with two thread colors going over and under each other","requiresChild":false,"stateful":false,"infrastructure":null,"qualityScore":71},{"id":"shader-effects-webcam-texture","component":"WebcamTexture","name":"Webcam Texture","category":"Textures","description":"Display a live webcam feed with customizable object-fit modes","requiresChild":false,"stateful":false,"infrastructure":"Camera capture is not enabled by selecting a material.","qualityScore":0},{"id":"shader-effects-wool","component":"Wool","name":"Wool","category":"Stylize","description":"Applies an interwoven fibrous fabric texture and distortion to child content","requiresChild":true,"stateful":false,"infrastructure":null,"qualityScore":62.1},{"id":"shader-effects-worley-noise","component":"WorleyNoise","name":"Worley Noise","category":"Textures","description":"Cellular noise field — distance-based, with selectable feature combinations and fractal octaves","requiresChild":false,"stateful":false,"infrastructure":null,"qualityScore":71.8},{"id":"shader-effects-zoom-blur","component":"ZoomBlur","name":"Zoom Blur","category":"Blurs","description":"Radial zoom blur expanding from a center point","requiresChild":true,"stateful":false,"infrastructure":null,"qualityScore":54.2}]},"controls":{"amplitude":{"default":3.2,"maximum":8,"minimum":0,"step":0.1,"type":"number"},"brightness":{"default":0.8,"maximum":2,"minimum":0.1,"step":0.05,"type":"number"},"centerX":{"default":0.5,"maximum":1,"minimum":0,"step":0.01,"type":"number"},"centerY":{"default":0.5,"maximum":1,"minimum":0,"step":0.01,"type":"number"},"colorA":{"default":"#73BFC4","type":"hex-color"},"colorB":{"default":"#FF810A","type":"hex-color"},"colorC":{"default":"#8DA0CE","type":"hex-color"},"density":{"default":0.8,"maximum":2,"minimum":0.1,"step":0.05,"type":"number"},"detail":{"default":3.2,"maximum":8,"minimum":0.5,"step":0.1,"type":"number"},"frequency":{"default":5.5,"maximum":10,"minimum":0.2,"step":0.1,"type":"number"},"grain":{"default":32,"maximum":100,"minimum":0,"step":1,"type":"number"},"rotationX":{"default":0,"maximum":360,"minimum":0,"step":1,"type":"number"},"rotationY":{"default":130,"maximum":360,"minimum":0,"step":1,"type":"number"},"rotationZ":{"default":70,"maximum":360,"minimum":0,"step":1,"type":"number"},"speed":{"default":0.3,"maximum":1.5,"minimum":0,"step":0.05,"type":"number"},"strength":{"default":0.3,"maximum":2,"minimum":0,"step":0.01,"type":"number"}},"count":197,"defaults":{"animation":"paper-dithering-swirl","heroAnimation":"paper-dithering-swirl","heroField":"paper-grain-gradient","heroMark":"paper-dithering-swirl","surface":"paper-gem-smoke"},"engines":[{"count":100,"name":"Paper Shaders"},{"count":9,"name":"Shaders.com study"},{"count":6,"name":"Design study"},{"count":9,"name":"Glyphfield"},{"count":1,"name":"WebGL Fluid"},{"count":1,"name":"Holo material"},{"count":70,"name":"Shaders.com WebGPU"},{"count":1,"name":"ShaderGradient"}],"lookPresets":[{"description":"A woven holographic surface with moving folds, anisotropic thread highlights, and fine foil sparkle.","id":"holo-cloth","materialId":"holo-cloth-silk","name":"Holo cloth","settings":{"amplitude":5.2,"brightness":0.94,"density":1.05,"detail":6.2,"frequency":7.2,"grain":24,"rotationZ":12,"speed":0.22,"strength":0.76}},{"description":"A restrained mesh with broad color movement and a fine surface grain.","id":"quiet-mesh","materialId":"glyphfield-mesh-gradient","name":"Quiet mesh","settings":{"amplitude":1.8,"brightness":0.86,"density":0.72,"detail":2.2,"frequency":3.4,"grain":14,"speed":0.18,"strength":0.28}},{"description":"Architectural black-card reflections with narrow highlights and restrained motion.","id":"polished-chrome","materialId":"shaders-fluid-chrome","name":"Polished chrome","settings":{"amplitude":2.2,"brightness":0.82,"density":0.7,"detail":4.8,"frequency":4.2,"grain":8,"rotationZ":8,"speed":0.12,"strength":0.46}},{"description":"A soft, pigment-like field with visible paper grain and slow atmospheric drift.","id":"soft-grain","materialId":"glyphfield-grain-gradient","name":"Soft grain","settings":{"amplitude":2.6,"brightness":0.92,"density":0.9,"detail":2.8,"frequency":3.2,"grain":42,"speed":0.16,"strength":0.34}},{"description":"A crisp ordered-dither field with graphic contrast and a steady directional flow.","id":"graphic-dither","materialId":"glyphfield-dither-gradient","name":"Graphic dither","settings":{"amplitude":3.4,"brightness":0.9,"density":1.1,"detail":3.6,"frequency":5.8,"grain":56,"rotationZ":18,"speed":0.24,"strength":0.62}},{"description":"Broad spectral currents converging into one soft, luminous energy field.","id":"spectral-focus","materialId":"shaders-spectral-bloom","name":"Spectral focus","settings":{"amplitude":3.8,"brightness":1.04,"density":0.78,"detail":3.2,"frequency":4.2,"grain":12,"rotationZ":28,"speed":0.26,"strength":0.82}},{"description":"A responsive GPU fluid field with luminous dye, soft advection, and restrained simulation detail.","id":"electric-fluid","materialId":"pavel-fluid-energy","name":"Electric fluid","settings":{"amplitude":4.2,"brightness":1.08,"density":1.12,"detail":3.8,"frequency":4.6,"grain":8,"speed":0.48,"strength":0.92}},{"description":"A dense glyph volume with deliberate depth, measured movement, and a clean silhouette.","id":"deep-glyph-field","materialId":"glyphfield-glyph-field","name":"Deep glyph field","settings":{"amplitude":4.8,"brightness":0.88,"density":1.28,"detail":5.2,"frequency":4.8,"grain":22,"rotationX":8,"rotationY":22,"rotationZ":0,"speed":0.2,"strength":0.58}},{"description":"High-contrast directional energy with sharper repetition and faster motion.","id":"kinetic-signal","materialId":"shaders-pistons","name":"Kinetic signal","settings":{"amplitude":5.6,"brightness":1.12,"density":1.2,"detail":5.8,"frequency":7.6,"grain":20,"rotationZ":26,"speed":0.62,"strength":1.05}}],"materials":[{"description":"Gem-like refractive smoke with luminous internal color. Paper’s Default preset.","engine":"Paper Shaders","id":"paper-gem-smoke","name":"Gem Smoke","qualityScore":90.8,"sourceLabel":"Paper · Apache-2.0","sourceUrl":"https://github.com/paper-design/shaders","category":"metal","kind":"backgrounds","motion":{"materialId":"paper-gem-smoke","provider":"paper","motionModel":"procedural","supportsPngSnapshot":true,"supportsEditableSeek":true,"loop":{"kind":"continuous","periodMs":null}}},{"description":"Architectural chrome shaped by dark reflection cards, narrow strip lights, and restrained movement.","engine":"Shaders.com study","id":"shaders-fluid-chrome","name":"Architectural Chrome","qualityScore":97,"category":"metal","kind":"backgrounds","motion":{"materialId":"shaders-fluid-chrome","provider":"custom-glsl","motionModel":"direct-time","supportsPngSnapshot":true,"supportsEditableSeek":true,"loop":{"kind":"continuous","periodMs":null}}},{"description":"An original luminous contour field inspired by Evil Rabbit’s line-based shader direction.","engine":"Design study","id":"study-line-field","name":"Electric Lines","qualityScore":99,"sourceLabel":"Evil Rabbit · visual reference","sourceUrl":"https://shaders.evilrabbit.com/#lines","category":"light","kind":"backgrounds","motion":{"materialId":"study-line-field","provider":"custom-glsl","motionModel":"direct-time","supportsPngSnapshot":true,"supportsEditableSeek":true,"loop":{"kind":"continuous","periodMs":null}}},{"description":"A chromatic liquid-metal surface with contour, dispersion, and flowing reflection. Paper’s Default preset.","engine":"Paper Shaders","id":"paper-liquid-metal","name":"Liquid Metal","qualityScore":92.8,"sourceLabel":"Paper · Apache-2.0","sourceUrl":"https://github.com/paper-design/shaders","category":"metal","kind":"backgrounds","motion":{"materialId":"paper-liquid-metal","provider":"paper","motionModel":"procedural","supportsPngSnapshot":true,"supportsEditableSeek":true,"loop":{"kind":"continuous","periodMs":null}}},{"description":"Original chrome light cards and moving glares inspired by Evil Rabbit’s metal studies.","engine":"Design study","id":"study-chrome-glares","name":"Chrome Glares","qualityScore":94.5,"sourceLabel":"Evil Rabbit · visual reference","sourceUrl":"https://shaders.evilrabbit.com/#glares","category":"metal","kind":"backgrounds","motion":{"materialId":"study-chrome-glares","provider":"custom-glsl","motionModel":"direct-time","supportsPngSnapshot":true,"supportsEditableSeek":true,"loop":{"kind":"continuous","periodMs":null}}},{"description":"Volumetric radial light with layered rays, bloom, and atmospheric density. Paper’s Default preset.","engine":"Paper Shaders","id":"paper-god-rays","name":"God Rays","qualityScore":89.8,"sourceLabel":"Paper · Apache-2.0","sourceUrl":"https://github.com/paper-design/shaders","category":"light","kind":"backgrounds","motion":{"materialId":"paper-god-rays","provider":"paper","motionModel":"procedural","supportsPngSnapshot":true,"supportsEditableSeek":true,"loop":{"kind":"continuous","periodMs":null}}},{"description":"Marbled color bands warped through layered noise and swirl. Paper’s Default preset.","engine":"Paper Shaders","id":"paper-warp","name":"Warp","qualityScore":86.8,"sourceLabel":"Paper · Apache-2.0","sourceUrl":"https://github.com/paper-design/shaders","category":"fluid","kind":"backgrounds","motion":{"materialId":"paper-warp","provider":"paper","motionModel":"procedural","supportsPngSnapshot":true,"supportsEditableSeek":true,"loop":{"kind":"continuous","periodMs":null}}},{"description":"A three-color flow resolved through a crisp ordered-dither matrix.","engine":"Glyphfield","id":"glyphfield-dither-gradient","name":"Dither gradient","qualityScore":82,"category":"gradient","kind":"backgrounds","motion":{"materialId":"glyphfield-dither-gradient","provider":"custom-glsl","motionModel":"direct-time","supportsPngSnapshot":true,"supportsEditableSeek":true,"loop":{"kind":"continuous","periodMs":null}}},{"description":"An original three-color mesh field with broad, editable focal movement.","engine":"Glyphfield","id":"glyphfield-mesh-gradient","name":"Mesh gradient","qualityScore":90,"category":"gradient","kind":"backgrounds","motion":{"materialId":"glyphfield-mesh-gradient","provider":"custom-glsl","motionModel":"direct-time","supportsPngSnapshot":true,"supportsEditableSeek":true,"loop":{"kind":"continuous","periodMs":null}}},{"description":"Soft spectral currents blended into a continuous, luminous energy bloom.","engine":"Shaders.com study","id":"shaders-spectral-bloom","name":"Spectral Bloom","qualityScore":100,"category":"light","kind":"backgrounds","motion":{"materialId":"shaders-spectral-bloom","provider":"custom-glsl","motionModel":"direct-time","supportsPngSnapshot":true,"supportsEditableSeek":true,"loop":{"kind":"continuous","periodMs":null}}},{"description":"An original dark-centered aura with spectral grain and a soft radiant aperture.","engine":"Design study","id":"study-radiant-void","name":"Radiant Void","qualityScore":96,"sourceLabel":"Grainient · visual reference","sourceUrl":"https://grainient.supply/freebies","category":"light","kind":"backgrounds","motion":{"materialId":"study-radiant-void","provider":"custom-glsl","motionModel":"direct-time","supportsPngSnapshot":true,"supportsEditableSeek":true,"loop":{"kind":"continuous","periodMs":null}}},{"description":"Original refractive rings with galactic color separation and tactile grain.","engine":"Design study","id":"study-galactic-rings","name":"Galactic Rings","qualityScore":95,"sourceLabel":"Grainient · visual reference","sourceUrl":"https://grainient.supply/freebies","category":"light","kind":"backgrounds","motion":{"materialId":"study-galactic-rings","provider":"custom-glsl","motionModel":"direct-time","supportsPngSnapshot":true,"supportsEditableSeek":true,"loop":{"kind":"continuous","periodMs":null}}},{"description":"A live GPU dye field adapted from Pavel Dobryakov’s MIT-licensed WebGL Fluid Simulation.","engine":"WebGL Fluid","id":"pavel-fluid-energy","name":"Fluid Energy","qualityScore":98,"sourceLabel":"PavelDoGreat · MIT","sourceUrl":"https://github.com/PavelDoGreat/WebGL-Fluid-Simulation","category":"fluid","kind":"interactive","motion":{"materialId":"pavel-fluid-energy","provider":"fluid","motionModel":"stateful","supportsPngSnapshot":true,"supportsEditableSeek":false,"loop":{"kind":"continuous","periodMs":null}}},{"description":"A woven holographic textile with procedural folds, thread highlights, and iridescent foil response.","engine":"Holo material","id":"holo-cloth-silk","name":"Holo Cloth","qualityScore":100.5,"sourceLabel":"HoloCloth · MIT","sourceUrl":"https://github.com/dmitrykurash/holocloth","category":"light","kind":"backgrounds","motion":{"materialId":"holo-cloth-silk","provider":"custom-glsl","motionModel":"direct-time","supportsPngSnapshot":true,"supportsEditableSeek":true,"loop":{"kind":"continuous","periodMs":null}}},{"description":"Merging glass bodies that refract the palette behind them, with chromatic dispersion, Fresnel rims and soft contact shadows.","engine":"Glyphfield","id":"glyphfield-liquid-glass","name":"Liquid Glass","qualityScore":97.5,"category":"metal","kind":"backgrounds","motion":{"materialId":"glyphfield-liquid-glass","provider":"custom-glsl","motionModel":"direct-time","supportsPngSnapshot":true,"supportsEditableSeek":true,"loop":{"kind":"continuous","periodMs":null}}},{"description":"Shifting underwater light: a dispersed caustic web over a deep palette pool.","engine":"Glyphfield","id":"glyphfield-caustics","name":"Caustics","qualityScore":96.5,"category":"light","kind":"backgrounds","motion":{"materialId":"glyphfield-caustics","provider":"custom-glsl","motionModel":"direct-time","supportsPngSnapshot":true,"supportsEditableSeek":true,"loop":{"kind":"continuous","periodMs":null}}},{"description":"Crumpled holographic foil with thin-film color that follows the viewing angle and the pointer light.","engine":"Glyphfield","id":"glyphfield-iridescent-foil","name":"Iridescent Foil","qualityScore":96,"category":"metal","kind":"backgrounds","motion":{"materialId":"glyphfield-iridescent-foil","provider":"custom-glsl","motionModel":"direct-time","supportsPngSnapshot":true,"supportsEditableSeek":true,"loop":{"kind":"continuous","periodMs":null}}},{"description":"Domain-warped emission clouds, bright filaments, dark dust lanes and a sparse star field.","engine":"Glyphfield","id":"glyphfield-nebula","name":"Nebula","qualityScore":95.5,"category":"light","kind":"backgrounds","motion":{"materialId":"glyphfield-nebula","provider":"custom-glsl","motionModel":"direct-time","supportsPngSnapshot":true,"supportsEditableSeek":true,"loop":{"kind":"continuous","periodMs":null}}},{"description":"A chromatic liquid-metal surface with contour, dispersion, and flowing reflection. Paper’s Noir preset.","engine":"Paper Shaders","id":"paper-liquid-metal-noir","name":"Liquid Metal · Noir","qualityScore":95,"sourceLabel":"Paper · Apache-2.0","sourceUrl":"https://github.com/paper-design/shaders","category":"metal","kind":"backgrounds","motion":{"materialId":"paper-liquid-metal-noir","provider":"paper","motionModel":"procedural","supportsPngSnapshot":true,"supportsEditableSeek":true,"loop":{"kind":"continuous","periodMs":null}}},{"description":"Overlapping satin ribbons with soft folds, sliding sheen and cast shadows.","engine":"Glyphfield","id":"glyphfield-silk-ribbons","name":"Silk Ribbons","qualityScore":94.5,"category":"gradient","kind":"backgrounds","motion":{"materialId":"glyphfield-silk-ribbons","provider":"custom-glsl","motionModel":"direct-time","supportsPngSnapshot":true,"supportsEditableSeek":true,"loop":{"kind":"continuous","periodMs":null}}},{"description":"A chromatic liquid-metal surface with contour, dispersion, and flowing reflection. Paper’s Stripes preset.","engine":"Paper Shaders","id":"paper-liquid-metal-stripes","name":"Liquid Metal · Stripes","qualityScore":94.5,"sourceLabel":"Paper · Apache-2.0","sourceUrl":"https://github.com/paper-design/shaders","category":"metal","kind":"backgrounds","motion":{"materialId":"paper-liquid-metal-stripes","provider":"paper","motionModel":"procedural","supportsPngSnapshot":true,"supportsEditableSeek":true,"loop":{"kind":"continuous","periodMs":null}}},{"description":"A dimensional color relief with editable ridges, grain, and directional light.","engine":"Design study","id":"study-relief-gradient","name":"Relief Gradient","qualityScore":94,"sourceLabel":"Gradientool · visual reference","sourceUrl":"https://www.gradientool.com/","category":"gradient","kind":"backgrounds","motion":{"materialId":"study-relief-gradient","provider":"custom-glsl","motionModel":"direct-time","supportsPngSnapshot":true,"supportsEditableSeek":true,"loop":{"kind":"continuous","periodMs":null}}},{"description":"Layered color bodies orbiting through a smooth procedural gradient field.","engine":"Design study","id":"study-orbit-gradient","name":"Orbit Gradient","qualityScore":93.5,"sourceLabel":"Gradientool · visual reference","sourceUrl":"https://www.gradientool.com/","category":"gradient","kind":"backgrounds","motion":{"materialId":"study-orbit-gradient","provider":"custom-glsl","motionModel":"direct-time","supportsPngSnapshot":true,"supportsEditableSeek":true,"loop":{"kind":"continuous","periodMs":null}}},{"description":"Gem-like refractive smoke with luminous internal color. Paper’s Fire preset.","engine":"Paper Shaders","id":"paper-gem-smoke-fire","name":"Gem Smoke · Fire","qualityScore":92.8,"sourceLabel":"Paper · Apache-2.0","sourceUrl":"https://github.com/paper-design/shaders","category":"metal","kind":"backgrounds","motion":{"materialId":"paper-gem-smoke-fire","provider":"paper","motionModel":"procedural","supportsPngSnapshot":true,"supportsEditableSeek":true,"loop":{"kind":"continuous","periodMs":null}}},{"description":"A chromatic liquid-metal surface with contour, dispersion, and flowing reflection. Paper’s Backdrop preset.","engine":"Paper Shaders","id":"paper-liquid-metal-backdrop","name":"Liquid Metal · Backdrop","qualityScore":92,"sourceLabel":"Paper · Apache-2.0","sourceUrl":"https://github.com/paper-design/shaders","category":"metal","kind":"backgrounds","motion":{"materialId":"paper-liquid-metal-backdrop","provider":"paper","motionModel":"procedural","supportsPngSnapshot":true,"supportsEditableSeek":true,"loop":{"kind":"continuous","periodMs":null}}},{"description":"Gem-like refractive smoke with luminous internal color. Paper’s Fluorescent preset.","engine":"Paper Shaders","id":"paper-gem-smoke-fluorescent","name":"Gem Smoke · Fluorescent","qualityScore":92.4,"sourceLabel":"Paper · Apache-2.0","sourceUrl":"https://github.com/paper-design/shaders","category":"metal","kind":"backgrounds","motion":{"materialId":"paper-gem-smoke-fluorescent","provider":"paper","motionModel":"procedural","supportsPngSnapshot":true,"supportsEditableSeek":true,"loop":{"kind":"continuous","periodMs":null}}},{"description":"Volumetric radial light with layered rays, bloom, and atmospheric density. Paper’s Ether preset.","engine":"Paper Shaders","id":"paper-god-rays-ether","name":"God Rays · Ether","qualityScore":91.6,"sourceLabel":"Paper · Apache-2.0","sourceUrl":"https://github.com/paper-design/shaders","category":"light","kind":"backgrounds","motion":{"materialId":"paper-god-rays-ether","provider":"paper","motionModel":"procedural","supportsPngSnapshot":true,"supportsEditableSeek":true,"loop":{"kind":"continuous","periodMs":null}}},{"description":"A turbulent luminous ring shaped by layered GPU noise. Paper’s Solar preset.","engine":"Paper Shaders","id":"paper-smoke-ring-solar","name":"Smoke Ring · Solar","qualityScore":90.8,"sourceLabel":"Paper · Apache-2.0","sourceUrl":"https://github.com/paper-design/shaders","category":"fluid","kind":"backgrounds","motion":{"materialId":"paper-smoke-ring-solar","provider":"paper","motionModel":"procedural","supportsPngSnapshot":true,"supportsEditableSeek":true,"loop":{"kind":"continuous","periodMs":null}}},{"id":"shader-effects-aurora","name":"Aurora","description":"Mesmerizing aurora borealis with layered curtains, vertical rays, and flowing light. · Textures","engine":"Shaders.com WebGPU","qualityScore":90,"sourceLabel":"Shaders.com · MIT","sourceUrl":"https://github.com/shader-effects-inc/shaders","category":"light","kind":"backgrounds","motion":{"materialId":"shader-effects-aurora","provider":"webgpu","motionModel":"procedural","supportsPngSnapshot":true,"supportsEditableSeek":true,"loop":{"kind":"continuous","periodMs":null}},"nativeControls":{"colorA":{"default":"#a533f8","type":"color","label":"Color A","group":"Colors","palette":"main"},"colorB":{"default":"#22ee88","type":"color","label":"Color B","group":"Colors","palette":"highlight"},"colorC":{"default":"#1694e8","type":"color","label":"Color C","group":"Colors","palette":"base"},"colorSpace":{"default":"linear","type":"select","options":[{"label":"Linear RGB","value":"linear"},{"label":"OKLCh","value":"oklch"},{"label":"OKLAB","value":"oklab"},{"label":"HSL","value":"hsl"},{"label":"HSV","value":"hsv"},{"label":"LCH","value":"lch"}],"label":"Color Space","group":"Colors"},"balance":{"default":50,"type":["range","map"],"min":0,"max":100,"step":1,"label":"Balance","group":"Colors"},"intensity":{"default":80,"type":["range","map"],"min":0,"max":100,"step":1,"label":"Intensity","group":"Aurora"},"curtainCount":{"default":4,"type":"range","min":1,"max":4,"step":1,"label":"Curtains","group":"Aurora"},"speed":{"default":5,"type":"range","min":-10,"max":10,"step":0.1,"label":"Speed","group":"Aurora","hidden":true},"waviness":{"default":50,"type":["range","map"],"min":0,"max":200,"step":1,"label":"Waviness","group":"Aurora"},"rayDensity":{"default":20,"type":["range","map"],"min":0,"max":100,"step":1,"label":"Ray Detail","group":"Aurora"},"height":{"default":120,"type":["range","map"],"min":10,"max":200,"step":1,"label":"Height","group":"Scene"},"center":{"default":{"x":0.5,"y":0},"type":"position","label":"Center","group":"Scene"},"seed":{"default":0,"type":["range","map"],"min":0,"max":100,"step":1,"label":"Seed","group":"Aurora"}},"settingsKey":"effectProps","requiresWebGPU":true},{"description":"Gem-like refractive smoke with luminous internal color. Paper’s Infrared preset.","engine":"Paper Shaders","id":"paper-gem-smoke-infrared","name":"Gem Smoke · Infrared","qualityScore":90,"sourceLabel":"Paper · Apache-2.0","sourceUrl":"https://github.com/paper-design/shaders","category":"metal","kind":"backgrounds","motion":{"materialId":"paper-gem-smoke-infrared","provider":"paper","motionModel":"procedural","supportsPngSnapshot":true,"supportsEditableSeek":true,"loop":{"kind":"continuous","periodMs":null}}},{"id":"shader-effects-liquid-metal","name":"Liquid Metal","description":"Flowing liquid chrome — a molten reflective surface that wraps the shape, sweeping a procedural studio reflection across animated folds with crisp speculars and prismatic edges · Shape Effects","engine":"Shaders.com WebGPU","qualityScore":89.9,"sourceLabel":"Shaders.com · MIT","sourceUrl":"https://github.com/shader-effects-inc/shaders","category":"metal","kind":"backgrounds","motion":{"materialId":"shader-effects-liquid-metal","provider":"webgpu","motionModel":"procedural","supportsPngSnapshot":true,"supportsEditableSeek":true,"loop":{"kind":"continuous","periodMs":null}},"nativeControls":{"surface":{"type":"select","label":"Surface","group":"Framing","default":"canvas","options":[{"label":"Full canvas","value":"canvas"},{"label":"Shape","value":"shape"}]},"origin":{"default":"center","type":"origin","label":"Origin","group":"Position"},"center":{"default":{"x":0.5,"y":0.5},"type":"position","label":"Center","group":"Position","units":["%","px"]},"scale":{"default":1,"type":"range","min":0.1,"max":3,"step":0.01,"label":"Scale","group":"Position"},"rotation":{"default":0,"type":"range","min":0,"max":360,"step":1,"label":"Rotation","group":"Position"},"lightColor":{"default":"#eef0f6","type":"color","label":"Light Color","group":"Metal","palette":"highlight"},"darkColor":{"default":"#141414","type":"color","label":"Dark Color","group":"Metal","palette":"base"},"turbulence":{"default":1,"type":"range","min":0,"max":1.5,"step":0.01,"label":"Turbulence","group":"Liquid"},"ripple":{"default":4,"type":"range","min":0.5,"max":8,"step":0.01,"label":"Ripple Scale","group":"Liquid"},"warp":{"default":1.5,"type":"range","min":0,"max":1.5,"step":0.01,"label":"Swirl","group":"Liquid"},"speed":{"default":0.5,"type":"range","min":0,"max":4,"step":0.01,"label":"Speed","group":"Liquid","hidden":true},"environment":{"default":1.5,"type":["range","map"],"min":0,"max":2,"step":0.01,"label":"Environment","group":"Surface"},"envRotation":{"default":0,"type":"range","min":0,"max":360,"step":1,"label":"Env Rotation","group":"Surface"},"sharpness":{"default":0.6,"type":"range","min":0,"max":1,"step":0.01,"label":"Sharpness","group":"Surface"},"dispersion":{"default":0.25,"type":["range","map"],"min":0,"max":1,"step":0.01,"label":"Dispersion","group":"Surface"},"lightAngle":{"default":265,"type":"range","min":0,"max":360,"step":1,"label":"Light Angle","group":"Surface"},"bevelWidth":{"default":0.05,"type":["range","map"],"min":0.005,"max":0.2,"step":0.001,"label":"Bevel Width","group":"Surface"},"bevelShape":{"default":0,"type":["range","map"],"min":0,"max":1,"step":0.01,"label":"Bevel Profile","group":"Surface"},"edgeSoftness":{"default":0.05,"type":["range","map"],"min":0,"max":1,"step":0.01,"label":"Edge Softness","group":"Surface"},"shape":{"default":"{\"type\":\"sphere3D\",\"radius\":0.35}","type":"shape","label":"Shape","group":"Shape"},"shapeSdfUrl":{"default":""},"shapeType":{"default":""}},"settingsKey":"effectProps","requiresWebGPU":true},{"id":"shader-effects-chrome","name":"Chrome","description":"Studio-lit mirror chrome — a precision-machined shape with a controllable polished bevel, softly convex faces and a photographic studio reflected in them: one huge frontal softbox, black flags, and thin warm/cool strip lights that fringe amber and ice-blue exactly where the reflections break · Shape Effects","engine":"Shaders.com WebGPU","qualityScore":89.8,"sourceLabel":"Shaders.com · MIT","sourceUrl":"https://github.com/shader-effects-inc/shaders","category":"metal","kind":"backgrounds","motion":{"materialId":"shader-effects-chrome","provider":"webgpu","motionModel":"procedural","supportsPngSnapshot":true,"supportsEditableSeek":true,"loop":{"kind":"continuous","periodMs":null}},"nativeControls":{"surface":{"type":"select","label":"Surface","group":"Framing","default":"canvas","options":[{"label":"Full canvas","value":"canvas"},{"label":"Shape","value":"shape"}]},"origin":{"default":"center","type":"origin","label":"Origin","group":"Position"},"center":{"default":{"x":0.5,"y":0.5},"type":"position","label":"Center","group":"Position","units":["%","px"]},"scale":{"default":1,"type":"range","min":0.1,"max":3,"step":0.01,"label":"Scale","group":"Position"},"rotation":{"default":0,"type":"range","min":0,"max":360,"step":1,"label":"Rotation","group":"Position"},"tint":{"default":"#ffffff","type":"color","label":"Tint","group":"Metal","palette":"highlight"},"warmColor":{"default":"#ffa94d","type":"color","label":"Warm Light","group":"Metal","palette":"main"},"coolColor":{"default":"#82a7e6","type":"color","label":"Cool Light","group":"Metal","palette":"highlight"},"bevelWidth":{"default":0.028,"type":["range","map"],"min":0.005,"max":0.2,"step":0.001,"label":"Bevel Width","group":"Bevel"},"bevelShape":{"default":0.55,"type":["range","map"],"min":0,"max":1,"step":0.01,"label":"Bevel Profile","group":"Bevel"},"curvature":{"default":0.5,"type":["range","map"],"min":0,"max":1,"step":0.01,"label":"Curvature","group":"Bevel"},"waviness":{"default":0.15,"type":["range","map"],"min":0,"max":1,"step":0.01,"label":"Waviness","group":"Bevel"},"environment":{"default":1,"type":["range","map"],"min":0,"max":2,"step":0.01,"label":"Environment","group":"Studio"},"envRotation":{"default":0,"type":["range","map"],"min":0,"max":360,"step":1,"label":"Env Rotation","group":"Studio"},"softness":{"default":0.3,"type":["range","map"],"min":0,"max":1,"step":0.01,"label":"Softness","group":"Studio"},"spectral":{"default":0.9,"type":["range","map"],"min":0,"max":2,"step":0.01,"label":"Accent Lights","group":"Studio"},"dispersion":{"default":0.3,"type":["range","map"],"min":0,"max":1,"step":0.01,"label":"Dispersion","group":"Studio"},"shadows":{"default":0.7,"type":["range","map"],"min":0,"max":1,"step":0.01,"label":"Shadows","group":"Studio"},"speed":{"default":0.5,"type":"range","min":0,"max":4,"step":0.01,"label":"Speed","group":"Studio","hidden":true},"edgeSoftness":{"default":0.05,"type":["range","map"],"min":0,"max":1,"step":0.01,"label":"Edge Softness","group":"Surface"},"shape":{"default":"{\"type\":\"sphere3D\",\"radius\":0.35}","type":"shape","label":"Shape","group":"Shape"},"shapeSdfUrl":{"default":""},"shapeType":{"default":""}},"settingsKey":"effectProps","requiresWebGPU":true},{"id":"shader-effects-holographic","name":"Holographic","description":"Iridescent holographic foil sticker with animated rainbow sheen and glitter flakes · Shape Effects","engine":"Shaders.com WebGPU","qualityScore":89.7,"sourceLabel":"Shaders.com · MIT","sourceUrl":"https://github.com/shader-effects-inc/shaders","category":"light","kind":"backgrounds","motion":{"materialId":"shader-effects-holographic","provider":"webgpu","motionModel":"procedural","supportsPngSnapshot":true,"supportsEditableSeek":true,"loop":{"kind":"continuous","periodMs":null}},"nativeControls":{"surface":{"type":"select","label":"Surface","group":"Framing","default":"canvas","options":[{"label":"Full canvas","value":"canvas"},{"label":"Shape","value":"shape"}]},"origin":{"default":"center","type":"origin","label":"Origin","group":"Position"},"center":{"default":{"x":0.5,"y":0.5},"type":"position","label":"Center","group":"Position","units":["%","px"]},"scale":{"default":1,"type":"range","min":0.1,"max":3,"step":0.01,"label":"Scale","group":"Position"},"rotation":{"default":0,"type":"range","min":0,"max":360,"step":1,"label":"Rotation","group":"Position"},"hueShift":{"default":0,"type":"range","min":0,"max":360,"step":1,"label":"Hue Shift","group":"Foil"},"foilScale":{"default":1.5,"type":"range","min":0.3,"max":6,"step":0.01,"label":"Foil Scale","group":"Foil"},"saturation":{"default":0.75,"type":"range","min":0,"max":1,"step":0.01,"label":"Saturation","group":"Foil"},"roughness":{"default":0.25,"type":"range","min":0,"max":1,"step":0.01,"label":"Roughness","group":"Foil"},"speed":{"default":1,"type":"range","min":0,"max":2,"step":0.01,"label":"Speed","group":"Animation","hidden":true},"crinkle":{"default":0.5,"type":"range","min":0,"max":1,"step":0.01,"label":"Crinkle","group":"Foil"},"crinkleScale":{"default":1,"type":"range","min":0.3,"max":6,"step":0.01,"label":"Crinkle Scale","group":"Foil"},"sparkle":{"default":0.4,"type":"range","min":0,"max":1,"step":0.01,"label":"Sparkle","group":"Foil"},"edgeSoftness":{"default":0.05,"type":"range","min":0,"max":1,"step":0.01,"label":"Edge Softness","group":"Foil"},"shape":{"default":"{\"type\":\"sphere3D\",\"radius\":0.35}","type":"shape","label":"Shape","group":"Shape"},"shapeSdfUrl":{"default":""},"shapeType":{"default":""}},"settingsKey":"effectProps","requiresWebGPU":true},{"id":"shader-effects-godrays","name":"Godrays","description":"Volumetric light rays emanating from a point · Textures","engine":"Shaders.com WebGPU","qualityScore":89.6,"sourceLabel":"Shaders.com · MIT","sourceUrl":"https://github.com/shader-effects-inc/shaders","category":"light","kind":"backgrounds","motion":{"materialId":"shader-effects-godrays","provider":"webgpu","motionModel":"procedural","supportsPngSnapshot":true,"supportsEditableSeek":true,"loop":{"kind":"continuous","periodMs":null}},"nativeControls":{"center":{"default":{"x":0,"y":0},"type":"position","label":"Center","group":"Position"},"density":{"default":0.3,"type":["range","map"],"min":0,"max":1,"step":0.1,"label":"Density","group":"Effect"},"intensity":{"default":0.8,"type":["range","map"],"min":0,"max":1,"step":0.1,"label":"Intensity","group":"Effect"},"spotty":{"default":1,"type":["range","map"],"min":0,"max":1,"step":0.1,"label":"Spotty","group":"Effect"},"speed":{"default":0.5,"type":"range","min":0,"max":2,"step":0.1,"label":"Speed","group":"Animation","hidden":true},"rayColor":{"default":"#4283fb","type":"color","label":"Ray Color","group":"Colors","palette":"main"},"backgroundColor":{"default":"#00000000","type":"color","label":"Background Color","group":"Colors","palette":"base"}},"settingsKey":"effectProps","requiresWebGPU":true},{"id":"shader-effects-plasma","name":"Plasma","description":"Animated effect of glowing plasma · Textures","engine":"Shaders.com WebGPU","qualityScore":89.5,"sourceLabel":"Shaders.com · MIT","sourceUrl":"https://github.com/shader-effects-inc/shaders","category":"gradient","kind":"backgrounds","motion":{"materialId":"shader-effects-plasma","provider":"webgpu","motionModel":"procedural","supportsPngSnapshot":true,"supportsEditableSeek":true,"loop":{"kind":"continuous","periodMs":null}},"nativeControls":{"density":{"default":2,"type":["range","map"],"min":0,"max":4,"step":0.1,"label":"Density","group":"Effect"},"speed":{"default":2,"type":"range","min":0,"max":5,"step":0.1,"label":"Speed","group":"Effect","hidden":true},"intensity":{"default":1.5,"type":["range","map"],"min":0.1,"max":3,"step":0.1,"label":"Intensity","group":"Colors"},"warp":{"default":0.4,"type":"range","min":0,"max":1,"step":0.01,"label":"Warp","group":"Effect"},"contrast":{"default":1,"type":["range","map"],"min":0,"max":3,"step":0.1,"label":"Contrast","group":"Colors"},"balance":{"default":50,"type":["range","map"],"min":0,"max":100,"step":1,"label":"Balance","group":"Colors"},"colorA":{"default":"#7018be","type":"color","label":"Color A","group":"Colors","palette":"base"},"colorB":{"default":"#000000","type":"color","label":"Color B","group":"Colors","palette":"main"},"stops":{"default":null,"type":"gradient-stops","label":"Colors","group":"Colors"},"colorSpace":{"default":"linear","type":"select","options":[{"label":"Linear RGB","value":"linear"},{"label":"OKLCh","value":"oklch"},{"label":"OKLAB","value":"oklab"},{"label":"HSL","value":"hsl"},{"label":"HSV","value":"hsv"},{"label":"LCH","value":"lch"}],"label":"Color Space","group":"Colors"}},"settingsKey":"effectProps","requiresWebGPU":true},{"description":"A soft four-stop flow with a fine print-registration screen.","engine":"Shaders.com study","id":"shaders-soft-register","name":"Soft Register","qualityScore":89.5,"category":"graphic","kind":"backgrounds","motion":{"materialId":"shaders-soft-register","provider":"custom-glsl","motionModel":"direct-time","supportsPngSnapshot":true,"supportsEditableSeek":true,"loop":{"kind":"continuous","periodMs":null}}},{"id":"shader-effects-mesh-gradient","name":"Mesh Gradient","description":"Flowing mesh gradient of soft drifting color swaths whose seams wrap through the palette · Textures","engine":"Shaders.com WebGPU","qualityScore":89.4,"sourceLabel":"Shaders.com · MIT","sourceUrl":"https://github.com/shader-effects-inc/shaders","category":"gradient","kind":"backgrounds","motion":{"materialId":"shader-effects-mesh-gradient","provider":"webgpu","motionModel":"procedural","supportsPngSnapshot":true,"supportsEditableSeek":true,"loop":{"kind":"continuous","periodMs":null}},"nativeControls":{"colorA":{"default":"#1a0533","type":"color","label":"Color A","group":"Colors","palette":"base"},"colorB":{"default":"#ffdf8e","type":"color","label":"Color B","group":"Colors","palette":"main"},"stops":{"default":[{"color":"#1a0533","position":0},{"color":"#6d2fd1","position":0.26},{"color":"#e04b9e","position":0.52},{"color":"#ff8c42","position":0.76},{"color":"#ffdf8e","position":1}],"type":"gradient-stops","label":"Colors","group":"Colors","palette":"ramp"},"colorSpace":{"default":"oklab","type":"select","options":[{"label":"Linear RGB","value":"linear"},{"label":"OKLCh","value":"oklch"},{"label":"OKLAB","value":"oklab"},{"label":"HSL","value":"hsl"},{"label":"HSV","value":"hsv"},{"label":"LCH","value":"lch"}],"label":"Color Space","group":"Colors"},"count":{"default":5,"type":"range","min":2,"max":8,"step":1,"label":"Points","group":"Effect"},"smoothness":{"default":2,"type":["range","map"],"min":0,"max":5,"step":0.01,"label":"Smoothness","group":"Effect"},"variation":{"default":0.35,"type":["range","map"],"min":0,"max":1,"step":0.01,"label":"Variation","group":"Effect"},"swirl":{"default":0.3,"type":["range","map"],"min":-1,"max":1,"step":0.01,"label":"Swirl","group":"Effect"},"drift":{"default":0.5,"type":["range","map"],"min":0,"max":1,"step":0.01,"label":"Drift","group":"Effect"},"wrapping":{"default":0,"type":["range","map"],"min":0,"max":1,"step":0.01,"label":"Wrapping","group":"Effect"},"speed":{"default":1,"type":"range","min":0,"max":10,"step":0.1,"label":"Speed","group":"Animation","hidden":true},"seed":{"default":0,"type":["range","map"],"min":0,"max":100,"step":1,"label":"Seed","group":"Effect"}},"settingsKey":"effectProps","requiresWebGPU":true},{"id":"shader-effects-nebula","name":"Nebula","description":"A volumetric gas nebula sealed inside polished glass; billowing emission clouds with hollow dark cavities and hot glowing cores, star fields drifting at real depth behind the gas, all refracted through the curved walls of the shape and dressed with studio reflections · Shape Effects","engine":"Shaders.com WebGPU","qualityScore":89.3,"sourceLabel":"Shaders.com · MIT","sourceUrl":"https://github.com/shader-effects-inc/shaders","category":"light","kind":"backgrounds","motion":{"materialId":"shader-effects-nebula","provider":"webgpu","motionModel":"procedural","supportsPngSnapshot":true,"supportsEditableSeek":true,"loop":{"kind":"continuous","periodMs":null}},"nativeControls":{"surface":{"type":"select","label":"Surface","group":"Framing","default":"canvas","options":[{"label":"Full canvas","value":"canvas"},{"label":"Shape","value":"shape"}]},"origin":{"default":"center","type":"origin","label":"Origin","group":"Position"},"center":{"default":{"x":0.5,"y":0.5},"type":"position","label":"Center","group":"Position","units":["%","px"]},"scale":{"default":1,"type":["range","map"],"min":0.1,"max":3,"step":0.01,"label":"Scale","group":"Position"},"rotation":{"default":0,"type":"range","min":0,"max":360,"step":1,"label":"Rotation","group":"Position"},"coreColor":{"default":"#ffd9b0","type":"color","label":"Core Color","group":"Nebula","palette":"highlight"},"gasColor":{"default":"#ff5e7a","type":"color","label":"Gas Color","group":"Nebula","palette":"main"},"veilColor":{"default":"#3a5bdb","type":"color","label":"Veil Color","group":"Nebula","palette":"base"},"colorSpace":{"default":"oklab","type":"select","options":[{"label":"Linear RGB","value":"linear"},{"label":"OKLCh","value":"oklch"},{"label":"OKLAB","value":"oklab"},{"label":"HSL","value":"hsl"},{"label":"HSV","value":"hsv"},{"label":"LCH","value":"lch"}],"label":"Color Space","group":"Nebula"},"density":{"default":1,"type":["range","map"],"min":0,"max":1,"step":0.01,"label":"Density","group":"Nebula"},"cavity":{"default":0,"type":["range","map"],"min":0,"max":1,"step":0.01,"label":"Cavity","group":"Nebula"},"dust":{"default":0.55,"type":["range","map"],"min":0,"max":1,"step":0.01,"label":"Dust","group":"Nebula"},"gasScale":{"default":0.4,"type":["range","map"],"min":0.1,"max":1,"step":0.01,"label":"Gas Scale","group":"Nebula"},"billow":{"default":0.6,"type":["range","map"],"min":0,"max":1,"step":0.01,"label":"Billow","group":"Nebula"},"glow":{"default":0,"type":["range","map"],"min":0,"max":2,"step":0.01,"label":"Glow","group":"Nebula"},"seed":{"default":0,"type":["range","map"],"min":0,"max":100,"step":1,"label":"Seed","group":"Nebula"},"stars":{"default":0.07,"type":["range","map"],"min":0,"max":1,"step":0.01,"label":"Stars","group":"Stars"},"starScale":{"default":1,"type":["range","map"],"min":0.25,"max":3,"step":0.01,"label":"Star Scale","group":"Stars"},"twinkle":{"default":0.35,"type":["range","map"],"min":0,"max":1,"step":0.01,"label":"Twinkle","group":"Stars"},"refraction":{"default":0.5,"type":["range","map"],"min":0,"max":1,"step":0.01,"label":"Refraction","group":"Glass"},"environment":{"default":0.7,"type":["range","map"],"min":0,"max":2,"step":0.01,"label":"Environment","group":"Glass"},"highlight":{"default":1.15,"type":["range","map"],"min":0,"max":2,"step":0.01,"label":"Highlight","group":"Glass"},"highlightSoftness":{"default":0.5,"type":["range","map"],"min":0,"max":1,"step":0.01,"label":"Highlight Softness","group":"Glass"},"lightAngle":{"default":315,"type":"range","min":0,"max":360,"step":1,"label":"Light Angle","group":"Glass"},"edgeSoftness":{"default":0.05,"type":["range","map"],"min":0,"max":1,"step":0.01,"label":"Edge Softness","group":"Glass"},"speed":{"default":0.3,"type":"range","min":0,"max":4,"step":0.01,"label":"Speed","group":"Animation","hidden":true},"shape":{"default":"{\"type\":\"sphere3D\",\"radius\":0.35}","type":"shape","label":"Shape","group":"Shape"},"shapeSdfUrl":{"default":""},"shapeType":{"default":""}},"settingsKey":"effectProps","requiresWebGPU":true},{"id":"shader-effects-flowing-gradient","name":"Flowing Gradient","description":"Liquid silk gradient with organic flowing color bands · Textures","engine":"Shaders.com WebGPU","qualityScore":89.1,"sourceLabel":"Shaders.com · MIT","sourceUrl":"https://github.com/shader-effects-inc/shaders","category":"gradient","kind":"backgrounds","motion":{"materialId":"shader-effects-flowing-gradient","provider":"webgpu","motionModel":"procedural","supportsPngSnapshot":true,"supportsEditableSeek":true,"loop":{"kind":"continuous","periodMs":null}},"nativeControls":{"colorA":{"default":"#0a0015","type":"color","label":"Color A","group":"Colors","palette":"base"},"colorB":{"default":"#6b17e6","type":"color","label":"Color B","group":"Colors","palette":"main"},"colorC":{"default":"#ff4d6a","type":"color","label":"Color C","group":"Colors","palette":"highlight"},"colorD":{"default":"#ff6b35","type":"color","label":"Color D","group":"Colors","palette":"main"},"colorSpace":{"default":"oklch","type":"select","options":[{"label":"Linear RGB","value":"linear"},{"label":"OKLCh","value":"oklch"},{"label":"OKLAB","value":"oklab"},{"label":"HSL","value":"hsl"},{"label":"HSV","value":"hsv"},{"label":"LCH","value":"lch"}],"label":"Color Space","group":"Colors"},"speed":{"default":1,"type":"range","min":0,"max":10,"step":0.1,"label":"Speed","group":"Effect","hidden":true},"distortion":{"default":0.5,"type":["range","map"],"min":0,"max":2,"step":0.1,"label":"Distortion","group":"Effect"},"seed":{"default":0,"type":["range","map"],"min":0,"max":100,"step":1,"label":"Seed","group":"Effect"}},"settingsKey":"effectProps","requiresWebGPU":true},{"description":"Volumetric radial light with layered rays, bloom, and atmospheric density. Paper’s Linear preset.","engine":"Paper Shaders","id":"paper-god-rays-linear","name":"God Rays · Linear","qualityScore":89,"sourceLabel":"Paper · Apache-2.0","sourceUrl":"https://github.com/paper-design/shaders","category":"light","kind":"backgrounds","motion":{"materialId":"paper-god-rays-linear","provider":"paper","motionModel":"procedural","supportsPngSnapshot":true,"supportsEditableSeek":true,"loop":{"kind":"continuous","periodMs":null}}},{"description":"A tactile gradient with animated pigment movement and integrated film grain.","engine":"Glyphfield","id":"glyphfield-grain-gradient","name":"Grain gradient","qualityScore":89,"category":"gradient","kind":"backgrounds","motion":{"materialId":"glyphfield-grain-gradient","provider":"custom-glsl","motionModel":"direct-time","supportsPngSnapshot":true,"supportsEditableSeek":true,"loop":{"kind":"continuous","periodMs":null}}},{"description":"Volumetric radial light with layered rays, bloom, and atmospheric density. Paper’s Warp preset.","engine":"Paper Shaders","id":"paper-god-rays-warp","name":"God Rays · Warp","qualityScore":89,"sourceLabel":"Paper · Apache-2.0","sourceUrl":"https://github.com/paper-design/shaders","category":"fluid","kind":"backgrounds","motion":{"materialId":"paper-god-rays-warp","provider":"paper","motionModel":"procedural","supportsPngSnapshot":true,"supportsEditableSeek":true,"loop":{"kind":"continuous","periodMs":null}}},{"description":"Flowing color spots with organic distortion, swirl, and fine surface grain. Paper’s Purple preset.","engine":"Paper Shaders","id":"paper-mesh-gradient-purple","name":"Mesh Gradient · Purple","qualityScore":89,"sourceLabel":"Paper · Apache-2.0","sourceUrl":"https://github.com/paper-design/shaders","category":"gradient","kind":"backgrounds","motion":{"materialId":"paper-mesh-gradient-purple","provider":"paper","motionModel":"procedural","supportsPngSnapshot":true,"supportsEditableSeek":true,"loop":{"kind":"continuous","periodMs":null}}},{"id":"shader-effects-prism","name":"Prism","description":"A beam of light that fans out and splits into a slowly-rotating rainbow past a controllable point. Transparent background — composite over a dark layer. · Textures","engine":"Shaders.com WebGPU","qualityScore":89,"sourceLabel":"Shaders.com · MIT","sourceUrl":"https://github.com/shader-effects-inc/shaders","category":"light","kind":"backgrounds","motion":{"materialId":"shader-effects-prism","provider":"webgpu","motionModel":"procedural","supportsPngSnapshot":true,"supportsEditableSeek":true,"loop":{"kind":"continuous","periodMs":null}},"nativeControls":{"position":{"default":{"x":0.18,"y":0.18},"type":"position","label":"Source","group":"Beam"},"beamWidth":{"default":0.04,"type":["range","map"],"min":0.002,"max":0.3,"step":0.002,"label":"Beam Width","group":"Beam"},"intensity":{"default":1.6,"type":["range","map"],"min":0,"max":4,"step":0.01,"label":"Intensity","group":"Beam"},"beamColor":{"default":"#ffffff","type":"color","label":"Beam Color","group":"Beam","palette":"highlight"},"startFalloff":{"default":0.15,"type":["range","map"],"min":0,"max":1,"step":0.01,"label":"Start Falloff","group":"Beam"},"endFalloff":{"default":0.6,"type":["range","map"],"min":0.02,"max":2,"step":0.01,"label":"End Falloff","group":"Beam"},"splitPosition":{"default":{"x":0.5,"y":0.42},"type":"position","label":"Split Point","group":"Spectrum"},"spread":{"default":0.7,"type":["range","map"],"min":0,"max":3,"step":0.01,"label":"Spread","group":"Spectrum"},"softness":{"default":0.12,"type":["range","map"],"min":0.001,"max":1,"step":0.005,"label":"Softness","group":"Spectrum"},"saturation":{"default":0.95,"type":["range","map"],"min":0,"max":1,"step":0.01,"label":"Saturation","group":"Spectrum"},"speed":{"default":0.1,"type":"range","min":-1,"max":1,"step":0.01,"label":"Hue Speed","group":"Spectrum","hidden":true}},"settingsKey":"effectProps","requiresWebGPU":true},{"id":"shader-effects-strands","name":"Strands","description":"Flowing ribbons of light with a multi-color gradient · Textures","engine":"Shaders.com WebGPU","qualityScore":88.9,"sourceLabel":"Shaders.com · MIT","sourceUrl":"https://github.com/shader-effects-inc/shaders","category":"gradient","kind":"backgrounds","motion":{"materialId":"shader-effects-strands","provider":"webgpu","motionModel":"procedural","supportsPngSnapshot":true,"supportsEditableSeek":true,"loop":{"kind":"continuous","periodMs":null}},"nativeControls":{"speed":{"default":0.5,"type":"range","min":0,"max":2,"step":0.1,"label":"Speed","group":"Animation","hidden":true},"amplitude":{"default":2,"type":["range","map"],"min":0,"max":5,"step":0.1,"label":"Amplitude","group":"Effect"},"frequency":{"default":0.3,"type":["range","map"],"min":0,"max":5,"step":0.1,"label":"Frequency","group":"Effect"},"lineCount":{"default":8,"type":"range","min":1,"max":16,"step":1,"label":"Strand Count","group":"Effect"},"lineWidth":{"default":0.05,"type":["range","map"],"min":0,"max":1,"step":0.05,"label":"Strand Width","group":"Effect"},"softness":{"default":0.05,"type":["range","map"],"min":0,"max":1,"step":0.05,"label":"Strand Softness","group":"Effect"},"spread":{"default":0.2,"type":["range","map"],"min":0,"max":1,"step":0.05,"label":"Spread","group":"Effect"},"pinEdges":{"default":false,"type":"checkbox","label":"Pin Edges","group":"Effect"},"stops":{"default":[{"color":"#00e5ff","position":0},{"color":"#5b8cff","position":0.34},{"color":"#b06bff","position":0.67},{"color":"#ff5fa2","position":1}],"type":"gradient-stops","label":"Colors","group":"Colors","palette":"ramp"},"colorSpace":{"default":"oklab","type":"select","options":[{"label":"Linear RGB","value":"linear"},{"label":"OKLCh","value":"oklch"},{"label":"OKLAB","value":"oklab"},{"label":"HSL","value":"hsl"},{"label":"HSV","value":"hsv"},{"label":"LCH","value":"lch"}],"label":"Color Space","group":"Colors"},"colorScale":{"default":1,"type":["range","map"],"min":1,"max":6,"step":1,"label":"Color Scale","group":"Colors"},"colorVariance":{"default":1,"type":["range","map"],"min":0,"max":1,"step":0.05,"label":"Color Variance","group":"Colors"},"colorSpeed":{"default":1,"type":"range","min":0,"max":2,"step":0.05,"label":"Color Speed","group":"Colors"},"start":{"default":{"x":0,"y":0.5},"type":"position","label":"Start","group":"Position"},"end":{"default":{"x":1,"y":0.5},"type":"position","label":"End","group":"Position"}},"settingsKey":"effectProps","requiresWebGPU":true},{"description":"A turbulent luminous ring shaped by layered GPU noise. Paper’s Default preset.","engine":"Paper Shaders","id":"paper-smoke-ring","name":"Smoke Ring","qualityScore":88.8,"sourceLabel":"Paper · Apache-2.0","sourceUrl":"https://github.com/paper-design/shaders","category":"fluid","kind":"backgrounds","motion":{"materialId":"paper-smoke-ring","provider":"paper","motionModel":"procedural","supportsPngSnapshot":true,"supportsEditableSeek":true,"loop":{"kind":"continuous","periodMs":null}}},{"description":"Marbled color bands warped through layered noise and swirl. Paper’s Live Ink preset.","engine":"Paper Shaders","id":"paper-warp-live-ink","name":"Warp · Live Ink","qualityScore":88.7,"sourceLabel":"Paper · Apache-2.0","sourceUrl":"https://github.com/paper-design/shaders","category":"fluid","kind":"backgrounds","motion":{"materialId":"paper-warp-live-ink","provider":"paper","motionModel":"procedural","supportsPngSnapshot":true,"supportsEditableSeek":true,"loop":{"kind":"continuous","periodMs":null}}},{"description":"Directional chroma movement viewed through fluted glass.","engine":"Shaders.com study","id":"shaders-chroma-flow","name":"Chroma Flow","qualityScore":88,"category":"graphic","kind":"backgrounds","motion":{"materialId":"shaders-chroma-flow","provider":"custom-glsl","motionModel":"direct-time","supportsPngSnapshot":true,"supportsEditableSeek":true,"loop":{"kind":"continuous","periodMs":null}}},{"description":"A turbulent luminous ring shaped by layered GPU noise. Paper’s Cloud preset.","engine":"Paper Shaders","id":"paper-smoke-ring-cloud","name":"Smoke Ring · Cloud","qualityScore":88,"sourceLabel":"Paper · Apache-2.0","sourceUrl":"https://github.com/paper-design/shaders","category":"fluid","kind":"backgrounds","motion":{"materialId":"paper-smoke-ring-cloud","provider":"paper","motionModel":"procedural","supportsPngSnapshot":true,"supportsEditableSeek":true,"loop":{"kind":"continuous","periodMs":null}}},{"description":"Flowing color spots with organic distortion, swirl, and fine surface grain. Paper’s Default preset.","engine":"Paper Shaders","id":"paper-mesh-gradient","name":"Mesh Gradient","qualityScore":87.8,"sourceLabel":"Paper · Apache-2.0","sourceUrl":"https://github.com/paper-design/shaders","category":"gradient","kind":"backgrounds","motion":{"materialId":"paper-mesh-gradient","provider":"paper","motionModel":"procedural","supportsPngSnapshot":true,"supportsEditableSeek":true,"loop":{"kind":"continuous","periodMs":null}}},{"description":"A turbulent luminous ring shaped by layered GPU noise. Paper’s Line preset.","engine":"Paper Shaders","id":"paper-smoke-ring-line","name":"Smoke Ring · Line","qualityScore":88,"sourceLabel":"Paper · Apache-2.0","sourceUrl":"https://github.com/paper-design/shaders","category":"fluid","kind":"backgrounds","motion":{"materialId":"paper-smoke-ring-line","provider":"paper","motionModel":"procedural","supportsPngSnapshot":true,"supportsEditableSeek":true,"loop":{"kind":"continuous","periodMs":null}}},{"description":"Hard directional rays broken across a tactile paper surface.","engine":"Shaders.com study","id":"shaders-pistons","name":"Pistons","qualityScore":87.5,"category":"graphic","kind":"backgrounds","motion":{"materialId":"shaders-pistons","provider":"custom-glsl","motionModel":"direct-time","supportsPngSnapshot":true,"supportsEditableSeek":true,"loop":{"kind":"continuous","periodMs":null}}},{"description":"A tactile animated gradient with dense analog grain and soft color bloom. Paper’s Wave preset.","engine":"Paper Shaders","id":"paper-grain-gradient-wave","name":"Grain Gradient · Wave","qualityScore":87.2,"sourceLabel":"Paper · Apache-2.0","sourceUrl":"https://github.com/paper-design/shaders","category":"gradient","kind":"backgrounds","motion":{"materialId":"paper-grain-gradient-wave","provider":"paper","motionModel":"procedural","supportsPngSnapshot":true,"supportsEditableSeek":true,"loop":{"kind":"continuous","periodMs":null}}},{"description":"Flowing color spots with organic distortion, swirl, and fine surface grain. Paper’s Beach preset.","engine":"Paper Shaders","id":"paper-mesh-gradient-beach","name":"Mesh Gradient · Beach","qualityScore":87,"sourceLabel":"Paper · Apache-2.0","sourceUrl":"https://github.com/paper-design/shaders","category":"gradient","kind":"backgrounds","motion":{"materialId":"paper-mesh-gradient-beach","provider":"paper","motionModel":"procedural","supportsPngSnapshot":true,"supportsEditableSeek":true,"loop":{"kind":"continuous","periodMs":null}}},{"description":"A controlled smoke plume with editable emission and decay.","engine":"Shaders.com study","id":"shaders-drift","name":"Drift","qualityScore":86.5,"category":"graphic","kind":"backgrounds","motion":{"materialId":"shaders-drift","provider":"custom-glsl","motionModel":"direct-time","supportsPngSnapshot":true,"supportsEditableSeek":true,"loop":{"kind":"continuous","periodMs":null}}},{"description":"Flowing color spots with organic distortion, swirl, and fine surface grain. Paper’s Ink preset.","engine":"Paper Shaders","id":"paper-mesh-gradient-ink","name":"Mesh Gradient · Ink","qualityScore":87,"sourceLabel":"Paper · Apache-2.0","sourceUrl":"https://github.com/paper-design/shaders","category":"gradient","kind":"backgrounds","motion":{"materialId":"paper-mesh-gradient-ink","provider":"paper","motionModel":"procedural","supportsPngSnapshot":true,"supportsEditableSeek":true,"loop":{"kind":"continuous","periodMs":null}}},{"description":"Refractive water caustics with layered surface motion. Paper’s Abstract preset.","engine":"Paper Shaders","id":"paper-water-abstract","name":"Water · Abstract","qualityScore":86.1,"sourceLabel":"Paper · Apache-2.0","sourceUrl":"https://github.com/paper-design/shaders","category":"fluid","kind":"backgrounds","motion":{"materialId":"paper-water-abstract","provider":"paper","motionModel":"procedural","supportsPngSnapshot":true,"supportsEditableSeek":true,"loop":{"kind":"continuous","periodMs":null}}},{"description":"The supplied animated sphere preset with environment light and film grain.","engine":"ShaderGradient","id":"shadergradient-prismatic-sphere","name":"Prismatic sphere","qualityScore":90.5,"category":"metal","kind":"backgrounds","motion":{"materialId":"shadergradient-prismatic-sphere","provider":"shadergradient","motionModel":"direct-time","supportsPngSnapshot":true,"supportsEditableSeek":true,"loop":{"kind":"configured","periodSource":"loopDurationMs","pixelVerified":false}}},{"description":"A spatial letterform built from hundreds of live glyphs, with editable depth, motion, density, and color.","engine":"Glyphfield","id":"glyphfield-glyph-field","name":"Glyph field","qualityScore":93,"category":"graphic","kind":"backgrounds","motion":{"materialId":"glyphfield-glyph-field","provider":"canvas2d","motionModel":"direct-time","supportsPngSnapshot":true,"supportsEditableSeek":true,"loop":{"kind":"continuous","periodMs":null}}},{"id":"shader-effects-obsidian","name":"Obsidian","description":"Dark tinted glass whose faces stay near-black while every surface turning away from the viewer ignites with a flowing iridescent gradient — vivid color living only on the oblique walls and bevels · Shape Effects","engine":"Shaders.com WebGPU","qualityScore":86,"sourceLabel":"Shaders.com · MIT","sourceUrl":"https://github.com/shader-effects-inc/shaders","category":"metal","kind":"backgrounds","motion":{"materialId":"shader-effects-obsidian","provider":"webgpu","motionModel":"procedural","supportsPngSnapshot":true,"supportsEditableSeek":true,"loop":{"kind":"continuous","periodMs":null}},"nativeControls":{"surface":{"type":"select","label":"Surface","group":"Framing","default":"canvas","options":[{"label":"Full canvas","value":"canvas"},{"label":"Shape","value":"shape"}]},"origin":{"default":"center","type":"origin","label":"Origin","group":"Position"},"center":{"default":{"x":0.5,"y":0.5},"type":"position","label":"Center","group":"Position","units":["%","px"]},"scale":{"default":1,"type":"range","min":0.1,"max":3,"step":0.01,"label":"Scale","group":"Position"},"rotation":{"default":0,"type":"range","min":0,"max":360,"step":1,"label":"Rotation","group":"Position"},"bodyColor":{"default":"#06071a","type":"color","label":"Body Color","group":"Colors","palette":"base"},"colorA":{"default":"#ff2f7a","type":"color","label":"Color A","group":"Colors","palette":"main"},"colorB":{"default":"#5fe6ff","type":"color","label":"Color B","group":"Colors","palette":"highlight"},"stops":{"default":[{"color":"#ff2f7a","position":0},{"color":"#2a2cff","position":0.3},{"color":"#5fe6ff","position":0.55},{"color":"#a6ffd8","position":0.75},{"color":"#ffb3e6","position":1}],"type":"gradient-stops","label":"Colors","group":"Colors","palette":"ramp"},"colorSpace":{"default":"oklab","type":"select","options":[{"label":"Linear RGB","value":"linear"},{"label":"OKLCh","value":"oklch"},{"label":"OKLAB","value":"oklab"},{"label":"HSL","value":"hsl"},{"label":"HSV","value":"hsv"},{"label":"LCH","value":"lch"}],"label":"Color Space","group":"Colors"},"iridescence":{"default":1,"type":["range","map"],"min":0,"max":1.5,"step":0.01,"label":"Iridescence","group":"Iridescence"},"rimWidth":{"default":0.55,"type":["range","map"],"min":0,"max":1,"step":0.01,"label":"Rim Width","group":"Iridescence"},"rimSoftness":{"default":0.25,"type":["range","map"],"min":0.02,"max":0.6,"step":0.01,"label":"Rim Softness","group":"Iridescence"},"flowAngle":{"default":30,"type":"range","min":0,"max":360,"step":1,"label":"Flow Angle","group":"Iridescence"},"flowScale":{"default":1,"type":["range","map"],"min":0.2,"max":4,"step":0.01,"label":"Flow Scale","group":"Iridescence"},"speed":{"default":0.5,"type":"range","min":0,"max":4,"step":0.01,"label":"Speed","group":"Iridescence","hidden":true},"gloss":{"default":0.35,"type":["range","map"],"min":0,"max":2,"step":0.01,"label":"Gloss","group":"Surface"},"envRotation":{"default":0,"type":"range","min":0,"max":360,"step":1,"label":"Env Rotation","group":"Surface"},"bevelWidth":{"default":0.08,"type":["range","map"],"min":0.005,"max":0.3,"step":0.001,"label":"Bevel Width","group":"Surface"},"bevelShape":{"default":0,"type":["range","map"],"min":0,"max":1,"step":0.01,"label":"Bevel Profile","group":"Surface"},"edgeSoftness":{"default":0.05,"type":["range","map"],"min":0,"max":1,"step":0.01,"label":"Edge Softness","group":"Surface"},"shape":{"default":"{\"type\":\"sphere3D\",\"radius\":0.35}","type":"shape","label":"Shape","group":"Shape"},"shapeSdfUrl":{"default":""},"shapeType":{"default":""}},"settingsKey":"effectProps","requiresWebGPU":true},{"description":"Marbled color bands warped through layered noise and swirl. Paper’s Cauldron Pot preset.","engine":"Paper Shaders","id":"paper-warp-cauldron-pot","name":"Warp · Cauldron Pot","qualityScore":86,"sourceLabel":"Paper · Apache-2.0","sourceUrl":"https://github.com/paper-design/shaders","category":"fluid","kind":"backgrounds","motion":{"materialId":"paper-warp-cauldron-pot","provider":"paper","motionModel":"procedural","supportsPngSnapshot":true,"supportsEditableSeek":true,"loop":{"kind":"continuous","periodMs":null}}},{"id":"shader-effects-light-edge","name":"Light Edge","description":"Glowing, pulsing light racing around the edge of any 2D, SVG, or 3D shape. Powered by Paper Shaders. · Shape Effects","engine":"Shaders.com WebGPU","qualityScore":85.9,"sourceLabel":"Shaders.com · MIT","sourceUrl":"https://github.com/shader-effects-inc/shaders","category":"light","kind":"backgrounds","motion":{"materialId":"shader-effects-light-edge","provider":"webgpu","motionModel":"procedural","supportsPngSnapshot":true,"supportsEditableSeek":true,"loop":{"kind":"continuous","periodMs":null}},"nativeControls":{"surface":{"type":"select","label":"Surface","group":"Framing","default":"canvas","options":[{"label":"Full canvas","value":"canvas"},{"label":"Shape","value":"shape"}]},"origin":{"default":"center","type":"origin","label":"Origin","group":"Position"},"center":{"default":{"x":0.5,"y":0.5},"type":"position","label":"Center","group":"Position","units":["%","px"]},"scale":{"default":1,"type":"range","min":0.1,"max":3,"step":0.01,"label":"Scale","group":"Position"},"rotation":{"default":0,"type":"range","min":0,"max":360,"step":1,"label":"Rotation","group":"Position"},"colorA":{"default":"#7b2ff7","type":"color","label":"Color A","group":"Colors","palette":"base"},"colorB":{"default":"#00e0ff","type":"color","label":"Color B","group":"Colors","palette":"main"},"stops":{"default":[{"color":"#7b2ff7","position":0},{"color":"#00e0ff","position":0.5},{"color":"#ff3d81","position":1}],"type":"gradient-stops","label":"Colors","group":"Colors","palette":"ramp"},"colorSpace":{"default":"linear","type":"select","options":[{"label":"Linear RGB","value":"linear"},{"label":"OKLCh","value":"oklch"},{"label":"OKLAB","value":"oklab"},{"label":"HSL","value":"hsl"},{"label":"HSV","value":"hsv"},{"label":"LCH","value":"lch"}],"label":"Color Space","group":"Colors"},"thickness":{"default":0.25,"type":["range","map"],"min":0.01,"max":1,"step":0.01,"label":"Thickness","group":"Border"},"softness":{"default":0.5,"type":["range","map"],"min":0,"max":1,"step":0.01,"label":"Softness","group":"Border"},"intensity":{"default":0.6,"type":["range","map"],"min":0,"max":1,"step":0.01,"label":"Intensity","group":"Light"},"bloom":{"default":0.3,"type":["range","map"],"min":0,"max":1,"step":0.01,"label":"Bloom","group":"Light"},"spots":{"default":3,"type":"range","min":1,"max":5,"step":1,"label":"Spots","group":"Light"},"spotSize":{"default":0.5,"type":["range","map"],"min":0,"max":1,"step":0.01,"label":"Spot Size","group":"Light"},"pulse":{"default":0,"type":["range","map"],"min":0,"max":1,"step":0.01,"label":"Pulse","group":"Animation"},"smoke":{"default":0.3,"type":["range","map"],"min":0,"max":1,"step":0.01,"label":"Smoke","group":"Smoke"},"smokeSize":{"default":0.5,"type":["range","map"],"min":0,"max":1,"step":0.01,"label":"Smoke Size","group":"Smoke"},"speed":{"default":1,"type":"range","min":0,"max":4,"step":0.1,"label":"Speed","group":"Animation","hidden":true},"seed":{"default":0,"type":["range","map"],"min":0,"max":100,"step":1,"label":"Seed","group":"Animation"},"shape":{"default":"{\"type\":\"sphere3D\",\"radius\":0.35}","type":"shape","label":"Shape","group":"Shape"},"shapeSdfUrl":{"default":""},"shapeType":{"default":""}},"settingsKey":"effectProps","requiresWebGPU":true},{"description":"Marbled color bands warped through layered noise and swirl. Paper’s Kelp preset.","engine":"Paper Shaders","id":"paper-warp-kelp","name":"Warp · Kelp","qualityScore":86,"sourceLabel":"Paper · Apache-2.0","sourceUrl":"https://github.com/paper-design/shaders","category":"fluid","kind":"backgrounds","motion":{"materialId":"paper-warp-kelp","provider":"paper","motionModel":"procedural","supportsPngSnapshot":true,"supportsEditableSeek":true,"loop":{"kind":"continuous","periodMs":null}}},{"description":"A tactile animated gradient with dense analog grain and soft color bloom. Paper’s Default preset.","engine":"Paper Shaders","id":"paper-grain-gradient","name":"Grain Gradient","qualityScore":85.8,"sourceLabel":"Paper · Apache-2.0","sourceUrl":"https://github.com/paper-design/shaders","category":"gradient","kind":"backgrounds","motion":{"materialId":"paper-grain-gradient","provider":"paper","motionModel":"procedural","supportsPngSnapshot":true,"supportsEditableSeek":true,"loop":{"kind":"continuous","periodMs":null}}},{"description":"Marbled color bands warped through layered noise and swirl. Paper’s Nectar preset.","engine":"Paper Shaders","id":"paper-warp-nectar","name":"Warp · Nectar","qualityScore":86,"sourceLabel":"Paper · Apache-2.0","sourceUrl":"https://github.com/paper-design/shaders","category":"fluid","kind":"backgrounds","motion":{"materialId":"paper-warp-nectar","provider":"paper","motionModel":"procedural","supportsPngSnapshot":true,"supportsEditableSeek":true,"loop":{"kind":"continuous","periodMs":null}}},{"id":"shader-effects-neon","name":"Neon","description":"Photorealistic neon tube / 3D pipe effect driven by a custom shape · Shape Effects","engine":"Shaders.com WebGPU","qualityScore":85.8,"sourceLabel":"Shaders.com · MIT","sourceUrl":"https://github.com/shader-effects-inc/shaders","category":"light","kind":"backgrounds","motion":{"materialId":"shader-effects-neon","provider":"webgpu","motionModel":"procedural","supportsPngSnapshot":true,"supportsEditableSeek":true,"loop":{"kind":"continuous","periodMs":null}},"nativeControls":{"surface":{"type":"select","label":"Surface","group":"Framing","default":"canvas","options":[{"label":"Full canvas","value":"canvas"},{"label":"Shape","value":"shape"}]},"origin":{"default":"center","type":"origin","label":"Origin","group":"Position"},"center":{"default":{"x":0.5,"y":0.5},"type":"position","label":"Center","group":"Position","units":["%","px"]},"scale":{"default":1,"type":"range","min":0.1,"max":3,"step":0.01,"label":"Scale","group":"Position"},"rotation":{"default":0,"type":"range","min":0,"max":360,"step":1,"label":"Rotation","group":"Position"},"color":{"default":"#00ddff","type":"color","label":"Tube Color","group":"Colors","palette":"main"},"secondaryColor":{"default":"#ff00aa","type":"color","label":"Secondary Color","group":"Colors","palette":"highlight"},"secondaryBlend":{"default":0.5,"type":"range","min":0,"max":1,"step":0.01,"label":"Blend","group":"Colors"},"glowColor":{"default":"#00ddff","type":"color","label":"Glow Color","group":"Colors","palette":"main"},"tubeThickness":{"default":0.2,"type":"range","min":0,"max":1,"step":0.01,"label":"Tube Thickness","group":"Tube"},"intensity":{"default":1.5,"type":"range","min":0.5,"max":4,"step":0.01,"label":"Intensity","group":"Tube"},"hotCoreIntensity":{"default":0.6,"type":"range","min":0,"max":1,"step":0.01,"label":"Hot Core","group":"Tube"},"glowIntensity":{"default":0.6,"type":"range","min":0,"max":2,"step":0.01,"label":"Glow Intensity","group":"Glow"},"glowRadius":{"default":0.25,"type":"range","min":0.01,"max":1,"step":0.01,"label":"Glow Radius","group":"Glow"},"lightAngle":{"default":300,"type":"range","min":0,"max":360,"step":1,"label":"Light Angle","group":"Lighting"},"specularIntensity":{"default":0.5,"type":"range","min":0,"max":2,"step":0.01,"label":"Specular","group":"Lighting"},"specularSize":{"default":0.5,"type":"range","min":0,"max":1,"step":0.01,"label":"Specular Size","group":"Lighting"},"cornerSmoothing":{"default":0.15,"type":"range","min":0,"max":1,"step":0.01,"label":"Corner Smoothing","group":"Tube"},"flickerSpeed":{"default":0,"type":"range","min":0,"max":5,"step":0.1,"label":"Speed","group":"Flicker"},"flickerAmount":{"default":0.2,"type":"range","min":0,"max":1,"step":0.01,"label":"Amount","group":"Flicker"},"flowSpeed":{"default":0,"type":"range","min":0,"max":5,"step":0.1,"label":"Speed","group":"Flow"},"flowAmount":{"default":0.3,"type":"range","min":0,"max":1,"step":0.01,"label":"Amount","group":"Flow"},"shape":{"default":"{\"type\":\"sphere3D\",\"radius\":0.35}","type":"shape","label":"Shape","group":"Shape"},"shapeSdfUrl":{"default":""},"shapeType":{"default":""}},"settingsKey":"effectProps","requiresWebGPU":true},{"description":"Marbled color bands warped through layered noise and swirl. Paper’s Passion preset.","engine":"Paper Shaders","id":"paper-warp-passion","name":"Warp · Passion","qualityScore":86,"sourceLabel":"Paper · Apache-2.0","sourceUrl":"https://github.com/paper-design/shaders","category":"fluid","kind":"backgrounds","motion":{"materialId":"paper-warp-passion","provider":"paper","motionModel":"procedural","supportsPngSnapshot":true,"supportsEditableSeek":true,"loop":{"kind":"continuous","periodMs":null}}},{"id":"shader-effects-irradiance","name":"Irradiance","description":"Photorealistic light spilling around the edge of any 2D, SVG, or 3D shape — any number of movable colored point lights strike the silhouette and the lit edges irradiate their surroundings, gathered in a compute pass with real cast shadows, mixing where they meet and burning to white at the rim · Shape Effects","engine":"Shaders.com WebGPU","qualityScore":85.7,"sourceLabel":"Shaders.com · MIT","sourceUrl":"https://github.com/shader-effects-inc/shaders","category":"light","kind":"backgrounds","motion":{"materialId":"shader-effects-irradiance","provider":"webgpu","motionModel":"procedural","supportsPngSnapshot":true,"supportsEditableSeek":true,"loop":{"kind":"continuous","periodMs":null}},"nativeControls":{"surface":{"type":"select","label":"Surface","group":"Framing","default":"canvas","options":[{"label":"Full canvas","value":"canvas"},{"label":"Shape","value":"shape"}]},"origin":{"default":"center","type":"origin","label":"Origin","group":"Position"},"center":{"default":{"x":0.5,"y":0.5},"type":"position","label":"Center","group":"Position","units":["%","px"]},"scale":{"default":1,"type":"range","min":0.1,"max":3,"step":0.01,"label":"Scale","group":"Position"},"rotation":{"default":0,"type":"range","min":0,"max":360,"step":1,"label":"Rotation","group":"Position"},"lights":{"default":[{"position":{"x":0.3,"y":0.3},"color":"#ffb347","intensity":3},{"position":{"x":0.72,"y":0.7},"color":"#7a5cff","intensity":2}],"type":"list","label":"Lights","group":"Lights","item":{"position":{"kind":"position","default":{"x":0.3,"y":0.3},"label":"Position","description":"Where this light sits — the edges facing it are struck and spill light outward. Map it to the mouse to carry the light around the shape."},"color":{"kind":"color","default":"#ffb347","label":"Color","description":"The color this light casts"},"intensity":{"kind":"number","default":3,"label":"Intensity","min":0,"max":8,"step":0.01,"description":"Brightness of this light — past ~2 the rim it strikes overexposes to white"}},"maxItems":6,"minItems":1,"itemLabel":"Light","palette":"lights"},"lightHeight":{"default":0.5,"type":["range","map"],"min":0.05,"max":3,"step":0.01,"label":"Light Height","group":"Light"},"lightRange":{"default":1.2,"type":["range","map"],"min":0.1,"max":4,"step":0.01,"label":"Range","group":"Light"},"reach":{"default":3,"type":["range","map"],"min":0.5,"max":8,"step":0.01,"label":"Reach","group":"Glow"},"core":{"default":1,"type":["range","map"],"min":0,"max":2,"step":0.01,"label":"Core","group":"Glow"},"wrap":{"default":0.1,"type":["range","map"],"min":0,"max":1,"step":0.01,"label":"Wrap","group":"Glow"},"shadows":{"default":true,"type":"checkbox","label":"Shadows","group":"Glow"},"shadowSoftness":{"default":0.15,"type":["range","map"],"min":0,"max":1,"step":0.01,"label":"Shadow Softness","group":"Glow"},"bodyColor":{"default":"#000000","type":"color","label":"Body Color","group":"Body","palette":"base"},"bodyLight":{"default":0.6,"type":["range","map"],"min":0,"max":2,"step":0.01,"label":"Body Light","group":"Body"},"bevelWidth":{"default":0.01,"type":["range","map"],"min":0.005,"max":0.2,"step":0.001,"label":"Bevel Width","group":"Body"},"edgeSoftness":{"default":0.05,"type":["range","map"],"min":0,"max":1,"step":0.01,"label":"Edge Softness","group":"Body"},"shape":{"default":"{\"type\":\"sphere3D\",\"radius\":0.35}","type":"shape","label":"Shape","group":"Shape"},"shapeSdfUrl":{"default":""},"shapeType":{"default":""}},"settingsKey":"effectProps","requiresWebGPU":true},{"id":"shader-effects-water","name":"Water","description":"Translucent water — a refractive, light-absorbing body that deepens to its color with thickness, wrapped in a wind-driven wave surface that reflects a procedural sky, with Fresnel-bright grazing edges and foam breaking on the crests and shoreline · Shape Effects","engine":"Shaders.com WebGPU","qualityScore":85.6,"sourceLabel":"Shaders.com · MIT","sourceUrl":"https://github.com/shader-effects-inc/shaders","category":"fluid","kind":"backgrounds","motion":{"materialId":"shader-effects-water","provider":"webgpu","motionModel":"procedural","supportsPngSnapshot":true,"supportsEditableSeek":true,"loop":{"kind":"continuous","periodMs":null}},"nativeControls":{"surface":{"type":"select","label":"Surface","group":"Framing","default":"canvas","options":[{"label":"Full canvas","value":"canvas"},{"label":"Shape","value":"shape"}]},"origin":{"default":"center","type":"origin","label":"Origin","group":"Position"},"center":{"default":{"x":0.5,"y":0.5},"type":"position","label":"Center","group":"Position","units":["%","px"]},"scale":{"default":1,"type":"range","min":0.1,"max":3,"step":0.01,"label":"Scale","group":"Position"},"rotation":{"default":0,"type":"range","min":0,"max":360,"step":1,"label":"Rotation","group":"Position"},"waterColor":{"default":"#00bfeb","type":"color","label":"Water Color","group":"Water","palette":"main"},"clarity":{"default":0.4,"type":"range","min":0,"max":1,"step":0.01,"label":"Clarity","group":"Water"},"depth":{"default":5,"type":"range","min":0,"max":8,"step":0.01,"label":"Depth","group":"Water"},"shallows":{"default":0.5,"type":"range","min":0,"max":1,"step":0.01,"label":"Shallows","group":"Water"},"caustics":{"default":0.15,"type":"range","min":0,"max":2,"step":0.01,"label":"Caustics","group":"Water"},"causticScale":{"default":6,"type":"range","min":1,"max":20,"step":0.1,"label":"Caustic Scale","group":"Water"},"choppiness":{"default":0.8,"type":"range","min":0,"max":1.5,"step":0.01,"label":"Choppiness","group":"Waves"},"waveScale":{"default":3.5,"type":"range","min":0.5,"max":8,"step":0.01,"label":"Wave Scale","group":"Waves"},"swirl":{"default":0.6,"type":"range","min":0,"max":1.5,"step":0.01,"label":"Swirl","group":"Waves"},"speed":{"default":0.5,"type":"range","min":0,"max":4,"step":0.01,"label":"Speed","group":"Waves","hidden":true},"reflection":{"default":2,"type":"range","min":0,"max":2,"step":0.01,"label":"Reflection","group":"Surface"},"envRotation":{"default":0,"type":"range","min":0,"max":360,"step":1,"label":"Env Rotation","group":"Surface"},"sharpness":{"default":0.1,"type":"range","min":0,"max":1,"step":0.01,"label":"Sharpness","group":"Surface"},"lightAngle":{"default":30,"type":"range","min":0,"max":360,"step":1,"label":"Light Angle","group":"Surface"},"foam":{"default":0.3,"type":"range","min":0,"max":1,"step":0.01,"label":"Foam","group":"Surface"},"edgeSoftness":{"default":0.05,"type":"range","min":0,"max":1,"step":0.01,"label":"Edge Softness","group":"Surface"},"shape":{"default":"{\"type\":\"sphere3D\",\"radius\":0.35}","type":"shape","label":"Shape","group":"Shape"},"shapeSdfUrl":{"default":""},"shapeType":{"default":""}},"settingsKey":"effectProps","requiresWebGPU":true},{"id":"shader-effects-marble","name":"Marble","description":"Classic marble swirl and vein texture using noise-warped sine waves · Textures","engine":"Shaders.com WebGPU","qualityScore":85.5,"sourceLabel":"Shaders.com · MIT","sourceUrl":"https://github.com/shader-effects-inc/shaders","category":"fluid","kind":"backgrounds","motion":{"materialId":"shader-effects-marble","provider":"webgpu","motionModel":"procedural","supportsPngSnapshot":true,"supportsEditableSeek":true,"loop":{"kind":"continuous","periodMs":null}},"nativeControls":{"colorA":{"default":"#ffffff","type":"color","label":"Base","group":"Colors","palette":"highlight"},"colorB":{"default":"#3a2d54","type":"color","label":"Tone","group":"Colors","palette":"main"},"colorC":{"default":"#0f0f0f","type":"color","label":"Depth","group":"Colors","palette":"base"},"scale":{"default":2,"type":["range","map"],"min":0.1,"max":10,"step":0.1,"label":"Scale","group":"Effect"},"turbulence":{"default":10,"type":["range","map"],"min":0,"max":50,"step":0.5,"label":"Turbulence","group":"Effect"},"speed":{"default":0.05,"type":"range","min":0,"max":0.25,"step":0.005,"label":"Speed","group":"Animation","hidden":true},"seed":{"default":0,"type":["range","map"],"min":0,"max":100,"step":1,"label":"Seed","group":"Effect"},"colorSpace":{"default":"linear","type":"select","options":[{"label":"Linear RGB","value":"linear"},{"label":"OKLCh","value":"oklch"},{"label":"OKLAB","value":"oklab"},{"label":"HSL","value":"hsl"},{"label":"HSV","value":"hsv"},{"label":"LCH","value":"lch"}],"label":"Color Space","group":"Colors"}},"settingsKey":"effectProps","requiresWebGPU":true},{"id":"shader-effects-swirl","name":"Swirl","description":"Flowing swirl pattern with multi-layered noise · Textures","engine":"Shaders.com WebGPU","qualityScore":85.4,"sourceLabel":"Shaders.com · MIT","sourceUrl":"https://github.com/shader-effects-inc/shaders","category":"fluid","kind":"backgrounds","motion":{"materialId":"shader-effects-swirl","provider":"webgpu","motionModel":"procedural","supportsPngSnapshot":true,"supportsEditableSeek":true,"loop":{"kind":"continuous","periodMs":null}},"nativeControls":{"colorA":{"default":"#1275d8","type":"color","label":"Color A","group":"Colors","palette":"base"},"colorB":{"default":"#e19136","type":"color","label":"Color B","group":"Colors","palette":"main"},"stops":{"default":null,"type":"gradient-stops","label":"Colors","group":"Colors"},"speed":{"default":1,"type":"range","min":0,"max":5,"step":0.1,"label":"Speed","group":"Animation","hidden":true},"detail":{"default":1,"type":["range","map"],"min":0,"max":5,"step":0.1,"label":"Detail","group":"Effect"},"blend":{"default":50,"type":["range","map"],"min":0,"max":100,"step":1,"label":"Blend","group":"Effect"},"colorSpace":{"default":"linear","type":"select","options":[{"label":"Linear RGB","value":"linear"},{"label":"OKLCh","value":"oklch"},{"label":"OKLAB","value":"oklab"},{"label":"HSL","value":"hsl"},{"label":"HSV","value":"hsv"},{"label":"LCH","value":"lch"}],"label":"Color Space","group":"Colors"}},"settingsKey":"effectProps","requiresWebGPU":true},{"id":"shader-effects-blob","name":"Blob","description":"Organic animated blob with 3D lighting and gradients · Textures","engine":"Shaders.com WebGPU","qualityScore":85.3,"sourceLabel":"Shaders.com · MIT","sourceUrl":"https://github.com/shader-effects-inc/shaders","category":"fluid","kind":"backgrounds","motion":{"materialId":"shader-effects-blob","provider":"webgpu","motionModel":"procedural","supportsPngSnapshot":true,"supportsEditableSeek":true,"loop":{"kind":"continuous","periodMs":null}},"nativeControls":{"origin":{"default":"center","type":"origin","label":"Origin","group":"Position"},"colorA":{"default":"#ff6b35","type":"color","label":"Color A","group":"Colors","palette":"base"},"colorB":{"default":"#e91e63","type":"color","label":"Color B","group":"Colors","palette":"main"},"stops":{"default":null,"type":"gradient-stops","label":"Colors","group":"Colors"},"size":{"default":0.5,"type":"range","min":0,"max":2,"step":0.01,"label":"Size","group":"Effect"},"deformation":{"default":0.5,"type":"range","min":0,"max":1,"step":0.1,"label":"Deformation","group":"Effect"},"softness":{"default":0.5,"type":["range","map"],"min":0,"max":1,"step":0.1,"label":"Softness","group":"Effect"},"highlightIntensity":{"default":0.5,"type":["range","map"],"min":0,"max":1,"step":0.1,"label":"Highlight Intensity","group":"Highlight"},"highlightX":{"default":0.3,"type":"range","min":-1,"max":1,"step":0.1,"label":"Highlight X","group":"Highlight"},"highlightY":{"default":-0.3,"type":"range","min":-1,"max":1,"step":0.1,"label":"Highlight Y","group":"Highlight"},"highlightZ":{"default":0.4,"type":"range","min":-1,"max":1,"step":0.1,"label":"Highlight Z","group":"Highlight"},"highlightColor":{"default":"#ffe11a","type":"color","label":"Highlight Color","group":"Highlight","palette":"highlight"},"speed":{"default":0.5,"type":["range","map"],"min":0,"max":2,"step":0.1,"label":"Speed","group":"Animation","hidden":true},"seed":{"default":1,"type":"range","min":0,"max":100,"step":1,"label":"Seed","group":"Effect"},"center":{"default":{"x":0.5,"y":0.5},"type":"position","label":"Center Position","group":"Position","units":["%","px"]},"colorSpace":{"default":"linear","type":"select","options":[{"label":"Linear RGB","value":"linear"},{"label":"OKLCh","value":"oklch"},{"label":"OKLAB","value":"oklab"},{"label":"HSL","value":"hsl"},{"label":"HSV","value":"hsv"},{"label":"LCH","value":"lch"}],"label":"Color Space","group":"Colors"}},"settingsKey":"effectProps","requiresWebGPU":true},{"id":"shader-effects-brushed-metal","name":"Brushed Metal","description":"Photorealistic brushed metal — a satin anodised surface combed with fine directional grain that smears the reflected studio and key light into the long anisotropic streaks of real brushed aluminium, steel, gold or copper · Shape Effects","engine":"Shaders.com WebGPU","qualityScore":85.1,"sourceLabel":"Shaders.com · MIT","sourceUrl":"https://github.com/shader-effects-inc/shaders","category":"metal","kind":"backgrounds","motion":{"materialId":"shader-effects-brushed-metal","provider":"webgpu","motionModel":"procedural","supportsPngSnapshot":true,"supportsEditableSeek":true,"loop":{"kind":"continuous","periodMs":null}},"nativeControls":{"surface":{"type":"select","label":"Surface","group":"Framing","default":"canvas","options":[{"label":"Full canvas","value":"canvas"},{"label":"Shape","value":"shape"}]},"origin":{"default":"center","type":"origin","label":"Origin","group":"Position"},"center":{"default":{"x":0.5,"y":0.5},"type":"position","label":"Center","group":"Position","units":["%","px"]},"scale":{"default":1,"type":"range","min":0.1,"max":3,"step":0.01,"label":"Scale","group":"Position"},"rotation":{"default":0,"type":"range","min":0,"max":360,"step":1,"label":"Rotation","group":"Position"},"lightColor":{"default":"#e9ebef","type":"color","label":"Light Color","group":"Metal","palette":"highlight"},"darkColor":{"default":"#26282d","type":"color","label":"Dark Color","group":"Metal","palette":"base"},"brushAngle":{"default":0,"type":"range","min":0,"max":360,"step":1,"label":"Brush Angle","group":"Brush"},"anisotropy":{"default":0.4,"type":"range","min":0,"max":1,"step":0.01,"label":"Anisotropy","group":"Brush"},"grain":{"default":0.4,"type":"range","min":0,"max":1,"step":0.01,"label":"Grain","group":"Brush"},"grainScale":{"default":2,"type":"range","min":0.25,"max":4,"step":0.01,"label":"Grain Scale","group":"Brush"},"roughness":{"default":0.5,"type":"range","min":0,"max":1,"step":0.01,"label":"Roughness","group":"Surface"},"environment":{"default":1.4,"type":["range","map"],"min":0,"max":2,"step":0.01,"label":"Environment","group":"Surface"},"envRotation":{"default":0,"type":"range","min":0,"max":360,"step":1,"label":"Env Rotation","group":"Surface"},"lightAngle":{"default":215,"type":"range","min":0,"max":360,"step":1,"label":"Light Angle","group":"Surface"},"speed":{"default":0.4,"type":"range","min":0,"max":4,"step":0.01,"label":"Speed","group":"Surface","hidden":true},"bevelWidth":{"default":0.05,"type":["range","map"],"min":0.005,"max":0.2,"step":0.001,"label":"Bevel Width","group":"Surface"},"bevelShape":{"default":0,"type":["range","map"],"min":0,"max":1,"step":0.01,"label":"Bevel Profile","group":"Surface"},"edgeSoftness":{"default":0.05,"type":["range","map"],"min":0,"max":1,"step":0.01,"label":"Edge Softness","group":"Surface"},"shape":{"default":"{\"type\":\"sphere3D\",\"radius\":0.35}","type":"shape","label":"Shape","group":"Shape"},"shapeSdfUrl":{"default":""},"shapeType":{"default":""}},"settingsKey":"effectProps","requiresWebGPU":true},{"description":"A tactile animated gradient with dense analog grain and soft color bloom. Paper’s Blob preset.","engine":"Paper Shaders","id":"paper-grain-gradient-blob","name":"Grain Gradient · Blob","qualityScore":85,"sourceLabel":"Paper · Apache-2.0","sourceUrl":"https://github.com/paper-design/shaders","category":"gradient","kind":"backgrounds","motion":{"materialId":"paper-grain-gradient-blob","provider":"paper","motionModel":"procedural","supportsPngSnapshot":true,"supportsEditableSeek":true,"loop":{"kind":"continuous","periodMs":null}}},{"id":"shader-effects-hologram","name":"Hologram","description":"Volumetric sci-fi hologram — a translucent emissive projection of the shape with fresnel-lit edges, depth scan-lines that wrap 3D forms, CRT scanlines, flicker and beam wobble · Shape Effects","engine":"Shaders.com WebGPU","qualityScore":85,"sourceLabel":"Shaders.com · MIT","sourceUrl":"https://github.com/shader-effects-inc/shaders","category":"light","kind":"backgrounds","motion":{"materialId":"shader-effects-hologram","provider":"webgpu","motionModel":"procedural","supportsPngSnapshot":true,"supportsEditableSeek":true,"loop":{"kind":"continuous","periodMs":null}},"nativeControls":{"surface":{"type":"select","label":"Surface","group":"Framing","default":"canvas","options":[{"label":"Full canvas","value":"canvas"},{"label":"Shape","value":"shape"}]},"origin":{"default":"center","type":"origin","label":"Origin","group":"Position"},"center":{"default":{"x":0.5,"y":0.5},"type":"position","label":"Center","group":"Position","units":["%","px"]},"scale":{"default":1,"type":"range","min":0.1,"max":3,"step":0.01,"label":"Scale","group":"Position"},"rotation":{"default":0,"type":"range","min":0,"max":360,"step":1,"label":"Rotation","group":"Position"},"color":{"default":"#5ec8ff","type":"color","label":"Color","group":"Style","palette":"main"},"brightness":{"default":2.5,"type":"range","min":0.2,"max":3,"step":0.01,"label":"Brightness","group":"Style"},"edgeSoftness":{"default":0.04,"type":"range","min":0,"max":1,"step":0.01,"label":"Edge Softness","group":"Style"},"fill":{"default":0.45,"type":"range","min":0,"max":1,"step":0.01,"label":"Volume Fill","group":"Volume"},"edgeGlow":{"default":1,"type":"range","min":0,"max":2.5,"step":0.01,"label":"Edge Glow","group":"Volume"},"depthLines":{"default":0.5,"type":"range","min":0,"max":1,"step":0.01,"label":"Depth Lines","group":"Volume"},"depthScale":{"default":26,"type":"range","min":4,"max":70,"step":1,"label":"Depth Density","group":"Volume"},"scanlines":{"default":0.55,"type":"range","min":0,"max":1,"step":0.01,"label":"Scanlines","group":"Scanlines"},"scanlineScale":{"default":130,"type":"range","min":20,"max":400,"step":1,"label":"Scanline Count","group":"Scanlines"},"scanlineSpeed":{"default":1,"type":"range","min":0,"max":5,"step":0.01,"label":"Scanline Drift","group":"Scanlines"},"sweep":{"default":0.1,"type":"range","min":0,"max":1,"step":0.01,"label":"Sweep Bar","group":"Scanlines"},"flicker":{"default":0.3,"type":"range","min":0,"max":1,"step":0.01,"label":"Flicker","group":"Interference"},"distortion":{"default":0.1,"type":"range","min":0,"max":1,"step":0.01,"label":"Distortion","group":"Interference"},"grain":{"default":0.7,"type":"range","min":0,"max":1,"step":0.01,"label":"Grain","group":"Interference"},"speed":{"default":1,"type":"range","min":0,"max":3,"step":0.01,"label":"Speed","group":"Animation","hidden":true},"shape":{"default":"{\"type\":\"sphere3D\",\"radius\":0.35}","type":"shape","label":"Shape","group":"Shape"},"shapeSdfUrl":{"default":""},"shapeType":{"default":""}},"settingsKey":"effectProps","requiresWebGPU":true},{"description":"A tactile animated gradient with dense analog grain and soft color bloom. Paper’s Dots preset.","engine":"Paper Shaders","id":"paper-grain-gradient-dots","name":"Grain Gradient · Dots","qualityScore":85,"sourceLabel":"Paper · Apache-2.0","sourceUrl":"https://github.com/paper-design/shaders","category":"gradient","kind":"backgrounds","motion":{"materialId":"paper-grain-gradient-dots","provider":"paper","motionModel":"procedural","supportsPngSnapshot":true,"supportsEditableSeek":true,"loop":{"kind":"continuous","periodMs":null}}},{"id":"shader-effects-frost","name":"Frost","description":"Photoreal frozen ice — thickness-driven subsurface scattering that reads as a solid block, with fine frost crystals creeping in from the edges · Shape Effects","engine":"Shaders.com WebGPU","qualityScore":84.9,"sourceLabel":"Shaders.com · MIT","sourceUrl":"https://github.com/shader-effects-inc/shaders","category":"metal","kind":"backgrounds","motion":{"materialId":"shader-effects-frost","provider":"webgpu","motionModel":"procedural","supportsPngSnapshot":true,"supportsEditableSeek":true,"loop":{"kind":"continuous","periodMs":null}},"nativeControls":{"surface":{"type":"select","label":"Surface","group":"Framing","default":"canvas","options":[{"label":"Full canvas","value":"canvas"},{"label":"Shape","value":"shape"}]},"origin":{"default":"center","type":"origin","label":"Origin","group":"Position"},"center":{"default":{"x":0.5,"y":0.5},"type":"position","label":"Center","group":"Position","units":["%","px"]},"scale":{"default":1,"type":"range","min":0.1,"max":3,"step":0.01,"label":"Scale","group":"Position"},"rotation":{"default":0,"type":"range","min":0,"max":360,"step":1,"label":"Rotation","group":"Position"},"iceColor":{"default":"#0597fc","type":"color","label":"Ice Color","group":"Ice","palette":"main"},"ambient":{"default":0,"type":"range","min":0,"max":1,"step":0.01,"label":"Ambient","group":"Ice"},"edgeSoftness":{"default":0.05,"type":"range","min":0,"max":1,"step":0.01,"label":"Edge Softness","group":"Ice"},"density":{"default":5,"type":"range","min":0,"max":10,"step":0.01,"label":"Density","group":"Subsurface"},"absorption":{"default":1,"type":"range","min":0,"max":2,"step":0.01,"label":"Absorption","group":"Subsurface"},"scatter":{"default":0.5,"type":"range","min":0,"max":1,"step":0.01,"label":"Scatter","group":"Subsurface"},"frostAmount":{"default":0.8,"type":"range","min":0,"max":1,"step":0.01,"label":"Frost","group":"Frost"},"frostDepth":{"default":0.4,"type":"range","min":0,"max":1,"step":0.01,"label":"Frost Depth","group":"Frost"},"frostScale":{"default":1,"type":"range","min":0.3,"max":4,"step":0.01,"label":"Frost Scale","group":"Frost"},"frostRoughness":{"default":3,"type":"range","min":1,"max":5,"step":0.01,"label":"Frost Roughness","group":"Frost"},"sparkle":{"default":0.5,"type":"range","min":0,"max":1,"step":0.01,"label":"Sparkle","group":"Frost"},"gloss":{"default":0.6,"type":"range","min":0,"max":1,"step":0.01,"label":"Gloss","group":"Surface"},"fresnel":{"default":0.02,"type":"range","min":0,"max":1,"step":0.01,"label":"Fresnel","group":"Surface"},"lightAngle":{"default":300,"type":"range","min":0,"max":360,"step":1,"label":"Light Angle","group":"Surface"},"speed":{"default":0.3,"type":"range","min":0,"max":2,"step":0.01,"label":"Speed","group":"Animation","hidden":true},"shape":{"default":"{\"type\":\"sphere3D\",\"radius\":0.35}","type":"shape","label":"Shape","group":"Shape"},"shapeSdfUrl":{"default":""},"shapeType":{"default":""}},"settingsKey":"effectProps","requiresWebGPU":true},{"description":"A tactile animated gradient with dense analog grain and soft color bloom. Paper’s Ripple preset.","engine":"Paper Shaders","id":"paper-grain-gradient-ripple","name":"Grain Gradient · Ripple","qualityScore":85,"sourceLabel":"Paper · Apache-2.0","sourceUrl":"https://github.com/paper-design/shaders","category":"gradient","kind":"backgrounds","motion":{"materialId":"paper-grain-gradient-ripple","provider":"paper","motionModel":"procedural","supportsPngSnapshot":true,"supportsEditableSeek":true,"loop":{"kind":"continuous","periodMs":null}}},{"id":"shader-effects-plastic","name":"Plastic","description":"Glossy molded plastic with photorealistic studio reflections, driven in a custom shape · Shape Effects","engine":"Shaders.com WebGPU","qualityScore":84.8,"sourceLabel":"Shaders.com · MIT","sourceUrl":"https://github.com/shader-effects-inc/shaders","category":"metal","kind":"backgrounds","motion":{"materialId":"shader-effects-plastic","provider":"webgpu","motionModel":"procedural","supportsPngSnapshot":true,"supportsEditableSeek":true,"loop":{"kind":"continuous","periodMs":null}},"nativeControls":{"surface":{"type":"select","label":"Surface","group":"Framing","default":"canvas","options":[{"label":"Full canvas","value":"canvas"},{"label":"Shape","value":"shape"}]},"origin":{"default":"center","type":"origin","label":"Origin","group":"Position"},"center":{"default":{"x":0.5,"y":0.5},"type":"position","label":"Center","group":"Position","units":["%","px"]},"scale":{"default":1,"type":"range","min":0.1,"max":3,"step":0.01,"label":"Scale","group":"Position"},"rotation":{"default":0,"type":"range","min":0,"max":360,"step":1,"label":"Rotation","group":"Position"},"colorA":{"default":"#f5f5f7","type":"color","label":"Color A","group":"Colors","palette":"main"},"colorB":{"default":"#d9dade","type":"color","label":"Color B","group":"Colors","palette":"base"},"stops":{"default":null,"type":"gradient-stops","label":"Colors","group":"Colors"},"gradientAngle":{"default":90,"type":"range","min":0,"max":360,"step":1,"label":"Gradient Angle","group":"Colors"},"colorSpace":{"default":"linear","type":"select","options":[{"label":"Linear RGB","value":"linear"},{"label":"OKLCh","value":"oklch"},{"label":"OKLAB","value":"oklab"},{"label":"HSL","value":"hsl"},{"label":"HSV","value":"hsv"},{"label":"LCH","value":"lch"}],"label":"Color Space","group":"Colors"},"thickness":{"default":0.5,"type":"range","min":0.05,"max":1,"step":0.01,"label":"Puffiness","group":"Plastic"},"roughness":{"default":0.12,"type":"range","min":0,"max":1,"step":0.01,"label":"Roughness","group":"Plastic"},"reflectivity":{"default":1,"type":"range","min":0,"max":2,"step":0.01,"label":"Reflectivity","group":"Plastic"},"crumple":{"default":0.25,"type":"range","min":0,"max":1,"step":0.01,"label":"Crumple","group":"Plastic"},"crumpleScale":{"default":1,"type":"range","min":0.5,"max":10,"step":0.1,"label":"Crumple Scale","group":"Plastic"},"crumpleCoverage":{"default":1,"type":"range","min":0,"max":1,"step":0.01,"label":"Crumple Coverage","group":"Plastic"},"seed":{"default":0,"type":"range","min":0,"max":100,"step":1,"label":"Seed","group":"Plastic"},"edgeSoftness":{"default":0.05,"type":"range","min":0,"max":1,"step":0.01,"label":"Edge Softness","group":"Plastic"},"lightAngle":{"default":315,"type":"range","min":0,"max":360,"step":1,"label":"Light Angle","group":"Lighting"},"speed":{"default":1,"type":"range","min":0,"max":4,"step":0.01,"label":"Speed","group":"Animation","hidden":true},"shading":{"default":0.35,"type":"range","min":0,"max":1,"step":0.01,"label":"Shading","group":"Lighting"},"rim":{"default":0.25,"type":"range","min":0,"max":1,"step":0.01,"label":"Rim Light","group":"Lighting"},"rimColor":{"default":"#ffffff","type":"color","label":"Rim Color","group":"Lighting","palette":"highlight"},"shape":{"default":"{\"type\":\"sphere3D\",\"radius\":0.35}","type":"shape","label":"Shape","group":"Shape"},"shapeSdfUrl":{"default":""},"shapeType":{"default":""}},"settingsKey":"effectProps","requiresWebGPU":true},{"description":"A tactile animated gradient with dense analog grain and soft color bloom. Paper’s Truchet preset.","engine":"Paper Shaders","id":"paper-grain-gradient-truchet","name":"Grain Gradient · Truchet","qualityScore":85,"sourceLabel":"Paper · Apache-2.0","sourceUrl":"https://github.com/paper-design/shaders","category":"gradient","kind":"backgrounds","motion":{"materialId":"paper-grain-gradient-truchet","provider":"paper","motionModel":"procedural","supportsPngSnapshot":true,"supportsEditableSeek":true,"loop":{"kind":"continuous","periodMs":null}}},{"description":"Refractive water caustics with layered surface motion. Paper’s Default preset.","engine":"Paper Shaders","id":"paper-water","name":"Water","qualityScore":84.8,"sourceLabel":"Paper · Apache-2.0","sourceUrl":"https://github.com/paper-design/shaders","category":"fluid","kind":"backgrounds","motion":{"materialId":"paper-water","provider":"paper","motionModel":"procedural","supportsPngSnapshot":true,"supportsEditableSeek":true,"loop":{"kind":"continuous","periodMs":null}}},{"id":"shader-effects-goo","name":"Goo","description":"Photoreal wet liquid — animated 3D metaball blobs that merge and bulge to loosely form the shape, with sliding wet highlights, a clearcoat rim and a translucent body · Shape Effects","engine":"Shaders.com WebGPU","qualityScore":84.7,"sourceLabel":"Shaders.com · MIT","sourceUrl":"https://github.com/shader-effects-inc/shaders","category":"fluid","kind":"backgrounds","motion":{"materialId":"shader-effects-goo","provider":"webgpu","motionModel":"procedural","supportsPngSnapshot":true,"supportsEditableSeek":true,"loop":{"kind":"continuous","periodMs":null}},"nativeControls":{"surface":{"type":"select","label":"Surface","group":"Framing","default":"canvas","options":[{"label":"Full canvas","value":"canvas"},{"label":"Shape","value":"shape"}]},"origin":{"default":"center","type":"origin","label":"Origin","group":"Position"},"center":{"default":{"x":0.5,"y":0.5},"type":"position","label":"Center","group":"Position","units":["%","px"]},"scale":{"default":1,"type":"range","min":0.1,"max":3,"step":0.01,"label":"Scale","group":"Position"},"rotation":{"default":0,"type":"range","min":0,"max":360,"step":1,"label":"Rotation","group":"Position"},"gooColor":{"default":"#37c95a","type":"color","label":"Goo Color","group":"Goo","palette":"main"},"translucency":{"default":0.6,"type":"range","min":0,"max":1,"step":0.01,"label":"Translucency","group":"Goo"},"absorb":{"default":2,"type":"range","min":0,"max":6,"step":0.01,"label":"Absorption","group":"Goo"},"containment":{"default":0.9,"type":"range","min":0,"max":1,"step":0.01,"label":"Containment","group":"Goo"},"edgeSoftness":{"default":0.06,"type":"range","min":0,"max":0.3,"step":0.005,"label":"Edge Softness","group":"Goo"},"blobScale":{"default":0.3,"type":"range","min":0.1,"max":1,"step":0.01,"label":"Blob Size","group":"Blobs"},"spread":{"default":1,"type":"range","min":0,"max":2,"step":0.01,"label":"Spread","group":"Blobs"},"merge":{"default":0.6,"type":"range","min":0,"max":1,"step":0.01,"label":"Merge","group":"Blobs"},"bulge":{"default":1,"type":"range","min":0,"max":1.5,"step":0.01,"label":"Bulge","group":"Blobs"},"threshold":{"default":0.5,"type":"range","min":0.2,"max":0.9,"step":0.01,"label":"Threshold","group":"Blobs"},"lightAngle":{"default":300,"type":"range","min":0,"max":360,"step":1,"label":"Light Angle","group":"Lighting"},"wetness":{"default":2,"type":"range","min":0,"max":5,"step":0.01,"label":"Highlights","group":"Lighting"},"fresnel":{"default":0.25,"type":"range","min":0,"max":1,"step":0.01,"label":"Fresnel","group":"Lighting"},"specColor":{"default":"#ffffff","type":"color","label":"Highlight Color","group":"Lighting","palette":"highlight"},"ambient":{"default":0.25,"type":"range","min":0,"max":1,"step":0.01,"label":"Ambient","group":"Lighting"},"speed":{"default":0.5,"type":"range","min":0,"max":2,"step":0.01,"label":"Speed","group":"Animation","hidden":true},"wobble":{"default":0.5,"type":"range","min":0,"max":1,"step":0.01,"label":"Wobble","group":"Animation"},"breathe":{"default":0.3,"type":"range","min":0,"max":1,"step":0.01,"label":"Breathe","group":"Animation"},"seed":{"default":1,"type":"range","min":0,"max":100,"step":1,"label":"Seed","group":"Animation"},"shape":{"default":"{\"type\":\"sphere3D\",\"radius\":0.35}","type":"shape","label":"Shape","group":"Shape"},"shapeSdfUrl":{"default":""},"shapeType":{"default":""}},"settingsKey":"effectProps","requiresWebGPU":true},{"id":"shader-effects-lens-flare","name":"Lens Flare","description":"Realistic camera lens flare with artifacts. · Stylize","engine":"Shaders.com WebGPU","qualityScore":84.4,"sourceLabel":"Shaders.com · MIT","sourceUrl":"https://github.com/shader-effects-inc/shaders","category":"light","kind":"backgrounds","motion":{"materialId":"shader-effects-lens-flare","provider":"webgpu","motionModel":"procedural","supportsPngSnapshot":true,"supportsEditableSeek":true,"loop":{"kind":"continuous","periodMs":null}},"nativeControls":{"lightPosition":{"default":{"x":0.3,"y":0.3},"type":"position","label":"Light Position","group":"Light"},"intensity":{"default":0.5,"type":["range","map"],"min":0,"max":2,"step":0.01,"label":"Intensity","group":"Light"},"ghostIntensity":{"default":0.4,"type":["range","map"],"min":0,"max":1,"step":0.01,"label":"Ghosts","group":"Reflections"},"ghostSpread":{"default":0.7,"type":"range","min":0.1,"max":2,"step":0.01,"label":"Ghost Spread","group":"Reflections"},"ghostChroma":{"default":0.3,"type":["range","map"],"min":0,"max":1,"step":0.01,"label":"Ghost Chroma","group":"Reflections"},"haloIntensity":{"default":0.4,"type":["range","map"],"min":0,"max":1,"step":0.01,"label":"Halo","group":"Reflections"},"haloRadius":{"default":0.6,"type":"range","min":0.1,"max":1,"step":0.01,"label":"Halo Size","group":"Reflections"},"haloChroma":{"default":0.6,"type":["range","map"],"min":0,"max":1,"step":0.01,"label":"Halo Chroma","group":"Reflections"},"haloSoftness":{"default":0.8,"type":["range","map"],"min":0.01,"max":3,"step":0.01,"label":"Halo Softness","group":"Reflections"},"starburstIntensity":{"default":0.3,"type":["range","map"],"min":0,"max":1,"step":0.01,"label":"Starburst","group":"Effects"},"starburstPoints":{"default":6,"type":["range","map"],"min":4,"max":16,"step":1,"label":"Blades","group":"Effects"},"streakIntensity":{"default":0.15,"type":["range","map"],"min":0,"max":1,"step":0.01,"label":"Streak","group":"Effects"},"streakLength":{"default":0.5,"type":["range","map"],"min":0.1,"max":1,"step":0.01,"label":"Streak Length","group":"Effects"},"glareIntensity":{"default":0.2,"type":["range","map"],"min":0,"max":1,"step":0.01,"label":"Glare","group":"Effects"},"glareSize":{"default":0.5,"type":["range","map"],"min":0.1,"max":1,"step":0.01,"label":"Glare Size","group":"Effects"},"edgeFade":{"default":0.2,"type":["range","map"],"min":0,"max":1,"step":0.01,"label":"Edge Fade","group":"Light"},"speed":{"default":0.5,"type":"range","min":0,"max":3,"step":0.1,"label":"Speed","group":"Animation","hidden":true}},"settingsKey":"effectProps","requiresWebGPU":true},{"description":"A neon grid warped over a moving high-contrast field.","engine":"Shaders.com study","id":"shaders-circuit","name":"Circuit","qualityScore":84,"category":"light","kind":"backgrounds","motion":{"materialId":"shaders-circuit","provider":"custom-glsl","motionModel":"direct-time","supportsPngSnapshot":true,"supportsEditableSeek":true,"loop":{"kind":"continuous","periodMs":null}}},{"description":"Refractive water caustics with layered surface motion. Paper’s Slow-mo preset.","engine":"Paper Shaders","id":"paper-water-slow-mo","name":"Water · Slow-mo","qualityScore":84,"sourceLabel":"Paper · Apache-2.0","sourceUrl":"https://github.com/paper-design/shaders","category":"fluid","kind":"backgrounds","motion":{"materialId":"paper-water-slow-mo","provider":"paper","motionModel":"procedural","supportsPngSnapshot":true,"supportsEditableSeek":true,"loop":{"kind":"continuous","periodMs":null}}},{"description":"A neural field of animated filaments, contrast, and colored light. Paper’s Default preset.","engine":"Paper Shaders","id":"paper-neuro-noise","name":"Neuro Noise","qualityScore":83.8,"sourceLabel":"Paper · Apache-2.0","sourceUrl":"https://github.com/paper-design/shaders","category":"gradient","kind":"backgrounds","motion":{"materialId":"paper-neuro-noise","provider":"paper","motionModel":"procedural","supportsPngSnapshot":true,"supportsEditableSeek":true,"loop":{"kind":"continuous","periodMs":null}}},{"description":"Refractive water caustics with layered surface motion. Paper’s Streaming preset.","engine":"Paper Shaders","id":"paper-water-streaming","name":"Water · Streaming","qualityScore":84,"sourceLabel":"Paper · Apache-2.0","sourceUrl":"https://github.com/paper-design/shaders","category":"fluid","kind":"backgrounds","motion":{"materialId":"paper-water-streaming","provider":"paper","motionModel":"procedural","supportsPngSnapshot":true,"supportsEditableSeek":true,"loop":{"kind":"continuous","periodMs":null}}},{"description":"A neural field of animated filaments, contrast, and colored light. Paper’s Bloodstream preset.","engine":"Paper Shaders","id":"paper-neuro-noise-bloodstream","name":"Neuro Noise · Bloodstream","qualityScore":83,"sourceLabel":"Paper · Apache-2.0","sourceUrl":"https://github.com/paper-design/shaders","category":"gradient","kind":"backgrounds","motion":{"materialId":"paper-neuro-noise-bloodstream","provider":"paper","motionModel":"procedural","supportsPngSnapshot":true,"supportsEditableSeek":true,"loop":{"kind":"continuous","periodMs":null}}},{"description":"Soft animated color bodies merging through an implicit surface field. Paper’s Default preset.","engine":"Paper Shaders","id":"paper-metaballs","name":"Metaballs","qualityScore":80.8,"sourceLabel":"Paper · Apache-2.0","sourceUrl":"https://github.com/paper-design/shaders","category":"fluid","kind":"backgrounds","motion":{"materialId":"paper-metaballs","provider":"paper","motionModel":"procedural","supportsPngSnapshot":true,"supportsEditableSeek":true,"loop":{"kind":"continuous","periodMs":null}}},{"description":"A neural field of animated filaments, contrast, and colored light. Paper’s Ghost preset.","engine":"Paper Shaders","id":"paper-neuro-noise-ghost","name":"Neuro Noise · Ghost","qualityScore":83,"sourceLabel":"Paper · Apache-2.0","sourceUrl":"https://github.com/paper-design/shaders","category":"gradient","kind":"backgrounds","motion":{"materialId":"paper-neuro-noise-ghost","provider":"paper","motionModel":"procedural","supportsPngSnapshot":true,"supportsEditableSeek":true,"loop":{"kind":"continuous","periodMs":null}}},{"description":"Soft animated color bodies merging through an implicit surface field. Paper’s Background preset.","engine":"Paper Shaders","id":"paper-metaballs-background","name":"Metaballs · Background","qualityScore":80,"sourceLabel":"Paper · Apache-2.0","sourceUrl":"https://github.com/paper-design/shaders","category":"fluid","kind":"backgrounds","motion":{"materialId":"paper-metaballs-background","provider":"paper","motionModel":"procedural","supportsPngSnapshot":true,"supportsEditableSeek":true,"loop":{"kind":"continuous","periodMs":null}}},{"description":"A neural field of animated filaments, contrast, and colored light. Paper’s Sensation preset.","engine":"Paper Shaders","id":"paper-neuro-noise-sensation","name":"Neuro Noise · Sensation","qualityScore":83,"sourceLabel":"Paper · Apache-2.0","sourceUrl":"https://github.com/paper-design/shaders","category":"gradient","kind":"backgrounds","motion":{"materialId":"paper-neuro-noise-sensation","provider":"paper","motionModel":"procedural","supportsPngSnapshot":true,"supportsEditableSeek":true,"loop":{"kind":"continuous","periodMs":null}}},{"description":"Soft animated color bodies merging through an implicit surface field. Paper’s Ink Drops preset.","engine":"Paper Shaders","id":"paper-metaballs-ink-drops","name":"Metaballs · Ink Drops","qualityScore":80,"sourceLabel":"Paper · Apache-2.0","sourceUrl":"https://github.com/paper-design/shaders","category":"fluid","kind":"backgrounds","motion":{"materialId":"paper-metaballs-ink-drops","provider":"paper","motionModel":"procedural","supportsPngSnapshot":true,"supportsEditableSeek":true,"loop":{"kind":"continuous","periodMs":null}}},{"id":"shader-effects-smoke-fill","name":"Smoke Fill","description":"Fill a shape with swirling fluid smoke that interacts with the shape boundary · Shape Effects","engine":"Shaders.com WebGPU","qualityScore":79.5,"sourceLabel":"Shaders.com · MIT","sourceUrl":"https://github.com/shader-effects-inc/shaders","category":"fluid","kind":"backgrounds","motion":{"materialId":"shader-effects-smoke-fill","provider":"webgpu","motionModel":"stateful","supportsPngSnapshot":true,"supportsEditableSeek":false,"loop":{"kind":"continuous","periodMs":null}},"nativeControls":{"surface":{"type":"select","label":"Surface","group":"Framing","default":"canvas","options":[{"label":"Full canvas","value":"canvas"},{"label":"Shape","value":"shape"}]},"colorA":{"default":"#8cf3ff","type":"color","label":"Start Color","group":"Colors","palette":"main"},"colorB":{"default":"#04a0d6","type":"color","label":"End Color","group":"Colors","palette":"highlight"},"origin":{"default":"center","type":"origin","label":"Origin","group":"Position"},"center":{"default":{"x":0.5,"y":0.5},"type":"position","label":"Center","group":"Position","units":["%","px"]},"scale":{"default":1,"type":"range","min":0.1,"max":3,"step":0.01,"label":"Scale","group":"Position"},"rotation":{"default":0,"type":"range","min":0,"max":360,"step":1,"label":"Rotation","group":"Position"},"emitFrom":{"default":{"x":0.5,"y":0.5},"type":"position","label":"Emit From","group":"Emission"},"direction":{"default":0,"type":"range","min":0,"max":360,"step":1,"label":"Direction","group":"Emission"},"speed":{"default":10,"type":"range","min":0.1,"max":30,"step":0.1,"label":"Speed","group":"Emission","hidden":true},"spread":{"default":60,"type":"range","min":0,"max":180,"step":1,"label":"Spread","group":"Emission"},"emitRadius":{"default":0.03,"type":"range","min":0.01,"max":0.3,"step":0.01,"label":"Emit Size","group":"Emission"},"intensity":{"default":1,"type":"range","min":0.1,"max":1,"step":0.01,"label":"Intensity","group":"Effect"},"dissipation":{"default":0.3,"type":"range","min":0.1,"max":5,"step":0.1,"label":"Dissipation","group":"Effect"},"detail":{"default":25,"type":"range","min":0,"max":50,"step":1,"label":"Detail","group":"Effect"},"gravity":{"default":0.5,"type":"range","min":-2,"max":2,"step":0.1,"label":"Gravity","group":"Effect"},"colorDecay":{"default":0.4,"type":"range","min":0,"max":3,"step":0.1,"label":"Color Decay","group":"Colors"},"mouseInfluence":{"default":0.1,"type":"range","min":0,"max":2,"step":0.01,"label":"Cursor Influence","group":"Interaction"},"mouseRadius":{"default":0.1,"type":"range","min":0.02,"max":0.5,"step":0.01,"label":"Cursor Radius","group":"Interaction"},"colorSpace":{"default":"linear","type":"select","options":[{"label":"Linear RGB","value":"linear"},{"label":"OKLCh","value":"oklch"},{"label":"OKLAB","value":"oklab"},{"label":"HSL","value":"hsl"},{"label":"HSV","value":"hsv"},{"label":"LCH","value":"lch"}],"label":"Color Space","group":"Colors"},"shape":{"default":"{\"type\":\"sphere3D\",\"radius\":0.35}","type":"shape","label":"Shape","group":"Shape"},"shapeSdfUrl":{"default":""},"shapeType":{"default":""}},"settingsKey":"effectProps","requiresWebGPU":true},{"description":"Soft animated color bodies merging through an implicit surface field. Paper’s Solar preset.","engine":"Paper Shaders","id":"paper-metaballs-solar","name":"Metaballs · Solar","qualityScore":80,"sourceLabel":"Paper · Apache-2.0","sourceUrl":"https://github.com/paper-design/shaders","category":"fluid","kind":"backgrounds","motion":{"materialId":"paper-metaballs-solar","provider":"paper","motionModel":"procedural","supportsPngSnapshot":true,"supportsEditableSeek":true,"loop":{"kind":"continuous","periodMs":null}}},{"id":"shader-effects-ink-flow","name":"Ink Flow","description":"Drag to paint swirling ribbons of ink through a real fluid field — eddies keep evolving after you let go · Interactive","engine":"Shaders.com WebGPU","qualityScore":79.3,"sourceLabel":"Shaders.com · MIT","sourceUrl":"https://github.com/shader-effects-inc/shaders","category":"fluid","kind":"interactive","motion":{"materialId":"shader-effects-ink-flow","provider":"webgpu","motionModel":"stateful","supportsPngSnapshot":true,"supportsEditableSeek":false,"loop":{"kind":"continuous","periodMs":null}},"nativeControls":{"colorMode":{"default":"custom","type":"select","options":[{"label":"Rainbow","value":"rainbow"},{"label":"Single Color","value":"single"},{"label":"Custom Colors","value":"custom"}],"label":"Color Mode","group":"Color"},"colorSpeed":{"default":1,"type":"range","min":0,"max":4,"step":0.05,"label":"Color Speed","group":"Color","condition":{"colorMode":["rainbow","custom"]}},"color":{"default":"#ff2d7e","type":"color","label":"Brush Color","group":"Color","condition":{"colorMode":"single"},"palette":"main"},"color1":{"default":"#4338ff","type":"color","label":"Color 1","group":"Color","condition":{"colorMode":"custom"},"palette":"base"},"color2":{"default":"#ff2d7e","type":"color","label":"Color 2","group":"Color","condition":{"colorMode":"custom"},"palette":"main"},"color3":{"default":"#19e3ff","type":"color","label":"Color 3","group":"Color","condition":{"colorMode":"custom"},"palette":"highlight"},"colorSpace":{"default":"oklab","type":"select","options":[{"label":"Linear RGB","value":"linear"},{"label":"OKLCh","value":"oklch"},{"label":"OKLAB","value":"oklab"},{"label":"HSL","value":"hsl"},{"label":"HSV","value":"hsv"},{"label":"LCH","value":"lch"}],"label":"Color Space","group":"Color","condition":{"colorMode":"custom"}},"radius":{"default":0.3,"type":"range","min":0.1,"max":5,"step":0.05,"label":"Radius","group":"Brush"},"force":{"default":1,"type":"range","min":0,"max":3,"step":0.05,"label":"Force","group":"Brush"},"curl":{"default":0,"type":"range","min":0,"max":60,"step":1,"label":"Swirl","group":"Dynamics"},"decay":{"default":0.5,"type":"range","min":0.05,"max":4,"step":0.05,"label":"Decay","group":"Dynamics"},"momentum":{"default":0.6,"type":"range","min":0,"max":1,"step":0.01,"label":"Momentum","group":"Dynamics"}},"settingsKey":"effectProps","requiresWebGPU":true},{"id":"shader-effects-smoke","name":"Smoke","description":"Realistic fluid smoke simulation with vorticity dynamics · Interactive","engine":"Shaders.com WebGPU","qualityScore":79.2,"sourceLabel":"Shaders.com · MIT","sourceUrl":"https://github.com/shader-effects-inc/shaders","category":"fluid","kind":"interactive","motion":{"materialId":"shader-effects-smoke","provider":"webgpu","motionModel":"stateful","supportsPngSnapshot":true,"supportsEditableSeek":false,"loop":{"kind":"continuous","periodMs":null}},"nativeControls":{"colorA":{"default":"#fc83f9","type":"color","label":"Start Color","group":"Colors","palette":"main"},"colorB":{"default":"#c21c79","type":"color","label":"End Color","group":"Colors","palette":"highlight"},"stops":{"default":null,"type":"gradient-stops","label":"Colors","group":"Colors"},"emitFrom":{"default":{"x":0.5,"y":1},"type":"position","label":"Emit From","group":"Emission"},"direction":{"default":0,"type":"range","min":0,"max":360,"step":1,"label":"Direction","group":"Emission"},"speed":{"default":20,"type":"range","min":0.1,"max":50,"step":0.1,"label":"Speed","group":"Emission","hidden":true},"spread":{"default":60,"type":"range","min":0,"max":180,"step":1,"label":"Spread","group":"Emission"},"emitRadius":{"default":0.08,"type":"range","min":0.01,"max":0.3,"step":0.01,"label":"Emit Size","group":"Emission"},"intensity":{"default":1,"type":"range","min":0.1,"max":1,"step":0.01,"label":"Intensity","group":"Effect"},"dissipation":{"default":0.2,"type":"range","min":0.1,"max":3,"step":0.1,"label":"Dissipation","group":"Effect"},"detail":{"default":25,"type":"range","min":0,"max":50,"step":1,"label":"Detail","group":"Effect"},"gravity":{"default":0.5,"type":"range","min":-2,"max":2,"step":0.1,"label":"Gravity","group":"Effect"},"colorDecay":{"default":0.4,"type":"range","min":0,"max":3,"step":0.1,"label":"Color Decay","group":"Colors"},"mouseInfluence":{"default":0.1,"type":"range","min":0,"max":2,"step":0.01,"label":"Cursor Influence","group":"Interaction"},"mouseRadius":{"default":0.1,"type":"range","min":0.02,"max":0.5,"step":0.01,"label":"Cursor Radius","group":"Interaction"},"colorSpace":{"default":"linear","type":"select","options":[{"label":"Linear RGB","value":"linear"},{"label":"OKLCh","value":"oklch"},{"label":"OKLAB","value":"oklab"},{"label":"HSL","value":"hsl"},{"label":"HSV","value":"hsv"},{"label":"LCH","value":"lch"}],"label":"Color Space","group":"Colors"}},"settingsKey":"effectProps","requiresWebGPU":true},{"id":"shader-effects-smoke-flow","name":"Smoke Flow","description":"Cursor-driven smoke that lingers, swirls, and dissipates with fluid dynamics · Interactive","engine":"Shaders.com WebGPU","qualityScore":79.1,"sourceLabel":"Shaders.com · MIT","sourceUrl":"https://github.com/shader-effects-inc/shaders","category":"fluid","kind":"interactive","motion":{"materialId":"shader-effects-smoke-flow","provider":"webgpu","motionModel":"stateful","supportsPngSnapshot":true,"supportsEditableSeek":false,"loop":{"kind":"continuous","periodMs":null}},"nativeControls":{"colorA":{"default":"#e29c8b","type":"color","label":"Fresh Color","group":"Colors","palette":"main"},"colorB":{"default":"#d517f9","type":"color","label":"Aged Color","group":"Colors","palette":"highlight"},"stops":{"default":null,"type":"gradient-stops","label":"Colors","group":"Colors"},"intensity":{"default":1,"type":"range","min":0.1,"max":2,"step":0.05,"label":"Intensity","group":"Emission"},"emitRadius":{"default":0.07,"type":"range","min":0.01,"max":0.3,"step":0.01,"label":"Puff Size","group":"Emission"},"momentum":{"default":20,"type":"range","min":0,"max":50,"step":1,"label":"Momentum","group":"Emission"},"dissipation":{"default":0.5,"type":"range","min":0.05,"max":3,"step":0.05,"label":"Dissipation","group":"Effect"},"detail":{"default":10,"type":"range","min":0,"max":60,"step":1,"label":"Swirl Detail","group":"Effect"},"gravity":{"default":2,"type":"range","min":-5,"max":5,"step":0.05,"label":"Gravity","group":"Effect"},"colorDecay":{"default":0.5,"type":"range","min":0,"max":3,"step":0.1,"label":"Color Decay","group":"Colors"},"colorSpace":{"default":"oklab","type":"select","options":[{"label":"Linear RGB","value":"linear"},{"label":"OKLCh","value":"oklch"},{"label":"OKLAB","value":"oklab"},{"label":"HSL","value":"hsl"},{"label":"HSV","value":"hsv"},{"label":"LCH","value":"lch"}],"label":"Color Space","group":"Colors"}},"settingsKey":"effectProps","requiresWebGPU":true},{"description":"An animated swirl reduced into a graphic pixel mosaic.","engine":"Shaders.com study","id":"shaders-mosaic","name":"Mosaic","qualityScore":79,"category":"graphic","kind":"backgrounds","motion":{"materialId":"shaders-mosaic","provider":"custom-glsl","motionModel":"direct-time","supportsPngSnapshot":true,"supportsEditableSeek":true,"loop":{"kind":"continuous","periodMs":null}}},{"id":"shader-effects-reaction-diffusion","name":"Reaction Diffusion","description":"A living Gray-Scott reaction-diffusion pattern that fills the layer and blooms wherever you drag the cursor · Interactive","engine":"Shaders.com WebGPU","qualityScore":79,"sourceLabel":"Shaders.com · MIT","sourceUrl":"https://github.com/shader-effects-inc/shaders","category":"fluid","kind":"interactive","motion":{"materialId":"shader-effects-reaction-diffusion","provider":"webgpu","motionModel":"stateful","supportsPngSnapshot":true,"supportsEditableSeek":false,"loop":{"kind":"continuous","periodMs":null}},"nativeControls":{"preset":{"default":"coral","type":"select","options":[{"label":"Coral","value":"coral"},{"label":"Mitosis","value":"mitosis"},{"label":"Spots","value":"spots"},{"label":"Maze","value":"maze"},{"label":"Worms","value":"worms"},{"label":"Fingerprints","value":"fingerprints"},{"label":"Holes","value":"holes"},{"label":"Solitons","value":"solitons"},{"label":"Bubbles","value":"bubbles"},{"label":"Waves","value":"waves"},{"label":"Flowers","value":"flowers"},{"label":"Custom","value":"custom"}],"label":"Pattern","group":"Pattern"},"feed":{"default":0.0545,"type":"range","min":0.01,"max":0.1,"step":0.001,"label":"Feed","group":"Pattern","condition":{"preset":"custom"}},"kill":{"default":0.062,"type":"range","min":0.03,"max":0.07,"step":0.001,"label":"Kill","group":"Pattern","condition":{"preset":"custom"}},"diffusionRatio":{"default":0.5,"type":"range","min":0.2,"max":0.9,"step":0.01,"label":"Diffusion Ratio","group":"Pattern"},"featureSize":{"default":3,"type":"range","min":1,"max":6,"step":0.1,"label":"Feature Size","group":"Pattern"},"speed":{"default":6,"type":"range","min":1,"max":16,"step":1,"label":"Speed","group":"Pattern","hidden":true},"brushSize":{"default":0.04,"type":"range","min":0.01,"max":0.3,"step":0.01,"label":"Brush Size","group":"Interaction"},"brushStrength":{"default":0.6,"type":"range","min":0,"max":1,"step":0.01,"label":"Brush Strength","group":"Interaction"},"colorA":{"default":"#00000000","type":"color","label":"Background","group":"Colors","palette":"base"},"colorC":{"default":"#38bdf8","type":"color","label":"Wall Color","group":"Colors","palette":"main"},"colorB":{"default":"#e2f5ff","type":"color","label":"Cell Color","group":"Colors","palette":"highlight"},"contrast":{"default":0.5,"type":["range","map"],"min":0,"max":1,"step":0.01,"label":"Contrast","group":"Colors"},"threshold":{"default":0.28,"type":["range","map"],"min":0.05,"max":0.6,"step":0.01,"label":"Threshold","group":"Colors"},"colorSpace":{"default":"oklch","type":"select","options":[{"label":"Linear RGB","value":"linear"},{"label":"OKLCh","value":"oklch"},{"label":"OKLAB","value":"oklab"},{"label":"HSL","value":"hsl"},{"label":"HSV","value":"hsv"},{"label":"LCH","value":"lch"}],"label":"Color Space","group":"Colors"},"relief":{"default":0.4,"type":["range","map"],"min":0,"max":1,"step":0.01,"label":"Relief","group":"Lighting"},"lightAngle":{"default":135,"type":["range","map"],"min":0,"max":360,"step":1,"label":"Light Angle","group":"Lighting"},"childInfluence":{"default":0.6,"type":["range","map"],"min":0,"max":1,"step":0.01,"label":"Influence","group":"Child"},"childContrast":{"default":0.5,"type":["range","map"],"min":0,"max":1,"step":0.01,"label":"Contrast","group":"Child"},"childThreshold":{"default":0.5,"type":["range","map"],"min":0,"max":1,"step":0.01,"label":"Threshold","group":"Child"},"childInvert":{"default":false,"type":"checkbox","label":"Invert","group":"Child"}},"settingsKey":"effectProps","requiresWebGPU":true},{"id":"shader-effects-chroma-flow","name":"Chroma Flow","description":"Interactive liquid flow effect that follows your cursor · Interactive","engine":"Shaders.com WebGPU","qualityScore":78.9,"sourceLabel":"Shaders.com · MIT","sourceUrl":"https://github.com/shader-effects-inc/shaders","category":"fluid","kind":"interactive","motion":{"materialId":"shader-effects-chroma-flow","provider":"webgpu","motionModel":"stateful","supportsPngSnapshot":true,"supportsEditableSeek":false,"loop":{"kind":"continuous","periodMs":null}},"nativeControls":{"baseColor":{"default":"#0066ff","type":"color","label":"Base Color","group":"Colors","palette":"base"},"upColor":{"default":"#00ff00","type":"color","label":"Up Color","group":"Colors","palette":"main"},"downColor":{"default":"#ff0000","type":"color","label":"Down Color","group":"Colors","palette":"highlight"},"leftColor":{"default":"#0000ff","type":"color","label":"Left Color","group":"Colors","palette":"base"},"rightColor":{"default":"#ffff00","type":"color","label":"Right Color","group":"Colors","palette":"main"},"intensity":{"default":1,"type":"range","min":0.5,"max":1.5,"step":0.1,"label":"Intensity","group":"Effect"},"radius":{"default":3,"type":"range","min":0,"max":5,"step":0.1,"label":"Radius","group":"Effect"},"momentum":{"default":30,"type":"range","min":10,"max":60,"step":1,"label":"Momentum","group":"Effect"}},"settingsKey":"effectProps","requiresWebGPU":true},{"id":"shader-effects-fog","name":"Fog","description":"Fog that fills the screen and interacts with the mouse · Interactive","engine":"Shaders.com WebGPU","qualityScore":78.4,"sourceLabel":"Shaders.com · MIT","sourceUrl":"https://github.com/shader-effects-inc/shaders","category":"fluid","kind":"interactive","motion":{"materialId":"shader-effects-fog","provider":"webgpu","motionModel":"stateful","supportsPngSnapshot":true,"supportsEditableSeek":false,"loop":{"kind":"continuous","periodMs":null}},"nativeControls":{"colorA":{"default":"#e0e0e0","type":"color","label":"Color A","group":"Colors","palette":"base"},"colorB":{"default":"#888888","type":"color","label":"Color B","group":"Colors","palette":"main"},"seed":{"default":0,"type":"range","min":0,"max":999,"step":1,"label":"Seed","group":"Field"},"speed":{"default":1,"type":"range","min":0.1,"max":3,"step":0.1,"label":"Speed","group":"Field","hidden":true},"turbulence":{"default":1,"type":"range","min":0,"max":3,"step":0.01,"label":"Turbulence","group":"Field"},"detail":{"default":15,"type":"range","min":0,"max":50,"step":1,"label":"Detail","group":"Field"},"blending":{"default":0.3,"type":"range","min":0,"max":1,"step":0.01,"label":"Blending","group":"Field"},"mouseInfluence":{"default":0.1,"type":"range","min":0,"max":2,"step":0.01,"label":"Cursor Influence","group":"Interaction"},"mouseRadius":{"default":0.1,"type":"range","min":0.02,"max":0.5,"step":0.01,"label":"Cursor Radius","group":"Interaction"},"colorSpace":{"default":"linear","type":"select","options":[{"label":"Linear RGB","value":"linear"},{"label":"OKLCh","value":"oklch"},{"label":"OKLAB","value":"oklab"},{"label":"HSL","value":"hsl"},{"label":"HSV","value":"hsv"},{"label":"LCH","value":"lch"}],"label":"Color Space","group":"Colors"}},"settingsKey":"effectProps","requiresWebGPU":true},{"id":"shader-effects-particle-flow","name":"Particle Flow","description":"Thousands of drifting dust particles carried by a real incompressible fluid field the cursor stirs — drag to plow a wake and the particles ride the eddies and vortices it leaves behind, while a gentle ambient breeze keeps the whole scene breathing on its own · Interactive","engine":"Shaders.com WebGPU","qualityScore":78.3,"sourceLabel":"Shaders.com · MIT","sourceUrl":"https://github.com/shader-effects-inc/shaders","category":"light","kind":"interactive","motion":{"materialId":"shader-effects-particle-flow","provider":"webgpu","motionModel":"stateful","supportsPngSnapshot":true,"supportsEditableSeek":false,"loop":{"kind":"continuous","periodMs":null}},"nativeControls":{"colorA":{"default":"#8ec5ff","type":"color","label":"Rest Color","group":"Colors","palette":"main"},"colorB":{"default":"#ffd98e","type":"color","label":"Excited Color","group":"Colors","palette":"highlight"},"colorSpace":{"default":"oklab","type":"select","options":[{"label":"Linear RGB","value":"linear"},{"label":"OKLCh","value":"oklch"},{"label":"OKLAB","value":"oklab"},{"label":"HSL","value":"hsl"},{"label":"HSV","value":"hsv"},{"label":"LCH","value":"lch"}],"label":"Color Space","group":"Colors"},"shape":{"default":"streak","type":"select","options":[{"label":"Arrow","value":"arrow"},{"label":"Streak","value":"streak"},{"label":"Dot","value":"dot"},{"label":"Square","value":"square"},{"label":"Glow","value":"glow"}],"label":"Shape","group":"Particles"},"count":{"default":6000,"type":"range","min":1000,"max":16000,"step":500,"label":"Count","group":"Particles"},"size":{"default":1.2,"type":"range","min":0.3,"max":3,"step":0.05,"label":"Size","group":"Particles"},"trails":{"default":0,"type":"range","min":0,"max":1,"step":0.01,"label":"Trails","group":"Particles"},"speed":{"default":1,"type":"range","min":0.2,"max":3,"step":0.05,"label":"Flow Speed","group":"Particles","hidden":true},"force":{"default":1,"type":"range","min":0,"max":3,"step":0.05,"label":"Cursor Force","group":"Dynamics"},"swirl":{"default":25,"type":"range","min":0,"max":60,"step":1,"label":"Swirl","group":"Dynamics"},"momentum":{"default":0.6,"type":"range","min":0,"max":1,"step":0.01,"label":"Momentum","group":"Dynamics"},"ambient":{"default":0.15,"type":"range","min":0,"max":1,"step":0.01,"label":"Ambient","group":"Dynamics"}},"settingsKey":"effectProps","requiresWebGPU":true},{"id":"shader-effects-magnetic-filings","name":"Magnetic Filings","description":"Thousands of tiny iron filings scattered on paper that swing to align with a magnetic field around the cursor, tracing out the field lines — a dipole whose axis follows the cursor's motion draws the classic two-lobed swirl, and every sweep of the magnet sends a glowing wave of filings flipping and settling · Interactive","engine":"Shaders.com WebGPU","qualityScore":78.2,"sourceLabel":"Shaders.com · MIT","sourceUrl":"https://github.com/shader-effects-inc/shaders","category":"light","kind":"interactive","motion":{"materialId":"shader-effects-magnetic-filings","provider":"webgpu","motionModel":"stateful","supportsPngSnapshot":true,"supportsEditableSeek":false,"loop":{"kind":"continuous","periodMs":null}},"nativeControls":{"colorA":{"default":"#be1ef9","type":"color","label":"Rest Color","group":"Colors","palette":"main"},"colorB":{"default":"#6326ff","type":"color","label":"Excited Color","group":"Colors","palette":"highlight"},"colorSpace":{"default":"oklab","type":"select","options":[{"label":"Linear RGB","value":"linear"},{"label":"OKLCh","value":"oklch"},{"label":"OKLAB","value":"oklab"},{"label":"HSL","value":"hsl"},{"label":"HSV","value":"hsv"},{"label":"LCH","value":"lch"}],"label":"Color Space","group":"Colors"},"shape":{"default":"dot","type":"select","options":[{"label":"Arrow","value":"arrow"},{"label":"Streak","value":"streak"},{"label":"Dot","value":"dot"},{"label":"Square","value":"square"},{"label":"Glow","value":"glow"}],"label":"Shape","group":"Filings"},"count":{"default":8000,"type":"range","min":500,"max":12000,"step":500,"label":"Count","group":"Filings"},"size":{"default":1,"type":"range","min":0.5,"max":3,"step":0.05,"label":"Size","group":"Filings"},"restOrientation":{"default":"random","type":"select","options":[{"label":"Random","value":"random"},{"label":"Horizontal","value":"horizontal"},{"label":"Vertical","value":"vertical"}],"label":"Rest Orientation","group":"Filings"},"fieldType":{"default":"dipole","type":"select","options":[{"label":"Dipole","value":"dipole"},{"label":"Radial","value":"radial"}],"label":"Field Type","group":"Field"},"strength":{"default":1.7,"type":"range","min":0,"max":3,"step":0.01,"label":"Strength","group":"Field"},"reach":{"default":0.6,"type":"range","min":0.1,"max":1,"step":0.01,"label":"Reach","group":"Field"},"response":{"default":0.5,"type":"range","min":0,"max":1,"step":0.01,"label":"Response","group":"Field"}},"settingsKey":"effectProps","requiresWebGPU":true},{"id":"shader-effects-boids","name":"Boids","description":"A living murmuration of hundreds of flocking agents drawn as crisp arrows, streaks, dots or glowing comets — separation, alignment and cohesion drive fluid, splitting-and-merging ribbons, agents flash toward an excited color when scattered, and the cursor acts as an attractor or a predator · Interactive","engine":"Shaders.com WebGPU","qualityScore":78.1,"sourceLabel":"Shaders.com · MIT","sourceUrl":"https://github.com/shader-effects-inc/shaders","category":"light","kind":"interactive","motion":{"materialId":"shader-effects-boids","provider":"webgpu","motionModel":"stateful","supportsPngSnapshot":true,"supportsEditableSeek":false,"loop":{"kind":"continuous","periodMs":null}},"nativeControls":{"colorA":{"default":"#8ec5ff","type":"color","label":"Rest Color","group":"Colors","palette":"main"},"colorB":{"default":"#ff7ad9","type":"color","label":"Excited Color","group":"Colors","palette":"highlight"},"colorSpace":{"default":"oklab","type":"select","options":[{"label":"Linear RGB","value":"linear"},{"label":"OKLCh","value":"oklch"},{"label":"OKLAB","value":"oklab"},{"label":"HSL","value":"hsl"},{"label":"HSV","value":"hsv"},{"label":"LCH","value":"lch"}],"label":"Color Space","group":"Colors"},"agentShape":{"default":"arrow","type":"select","options":[{"label":"Arrow","value":"arrow"},{"label":"Streak","value":"streak"},{"label":"Dot","value":"dot"},{"label":"Square","value":"square"},{"label":"Glow","value":"glow"}],"label":"Shape","group":"Flock"},"count":{"default":2000,"type":"range","min":100,"max":4000,"step":100,"label":"Count","group":"Flock"},"speed":{"default":2,"type":"range","min":0.2,"max":5,"step":0.1,"label":"Speed","group":"Flock","hidden":true},"seed":{"default":0,"type":"range","min":0,"max":100,"step":1,"label":"Seed","group":"Flock"},"size":{"default":1.5,"type":"range","min":0.5,"max":3,"step":0.05,"label":"Size","group":"Flock"},"trails":{"default":0,"type":"range","min":0,"max":1,"step":0.01,"label":"Trails","group":"Flock"},"separation":{"default":1.7,"type":"range","min":0,"max":3,"step":0.01,"label":"Separation","group":"Flocking"},"alignment":{"default":1.5,"type":"range","min":0,"max":3,"step":0.01,"label":"Alignment","group":"Flocking"},"cohesion":{"default":1,"type":"range","min":0,"max":3,"step":0.01,"label":"Cohesion","group":"Flocking"},"perception":{"default":0.12,"type":"range","min":0.05,"max":0.35,"step":0.01,"label":"Perception","group":"Flocking"},"cursorMode":{"default":"repel","type":"select","options":[{"label":"None","value":"none"},{"label":"Attract","value":"attract"},{"label":"Predator","value":"repel"}],"label":"Cursor","group":"Interaction"},"cursorStrength":{"default":1.5,"type":"range","min":0,"max":3,"step":0.01,"label":"Cursor Strength","group":"Interaction"}},"settingsKey":"effectProps","requiresWebGPU":true},{"description":"Plasma sliced through an adjustable ordered-dither field.","engine":"Shaders.com study","id":"shaders-pixel-beams","name":"Pixel Beams","qualityScore":77,"category":"graphic","kind":"backgrounds","motion":{"materialId":"shaders-pixel-beams","provider":"custom-glsl","motionModel":"direct-time","supportsPngSnapshot":true,"supportsEditableSeek":true,"loop":{"kind":"continuous","periodMs":null}}},{"description":"Layered color bands twisted into a soft animated vortex. Paper’s Default preset.","engine":"Paper Shaders","id":"paper-swirl","name":"Swirl","qualityScore":75.8,"sourceLabel":"Paper · Apache-2.0","sourceUrl":"https://github.com/paper-design/shaders","category":"fluid","kind":"backgrounds","motion":{"materialId":"paper-swirl","provider":"paper","motionModel":"procedural","supportsPngSnapshot":true,"supportsEditableSeek":true,"loop":{"kind":"continuous","periodMs":null}}},{"description":"Dimensional translucent color planes with animated depth. Paper’s Default preset.","engine":"Paper Shaders","id":"paper-color-panels","name":"Color Panels","qualityScore":73.8,"sourceLabel":"Paper · Apache-2.0","sourceUrl":"https://github.com/paper-design/shaders","category":"gradient","kind":"backgrounds","motion":{"materialId":"paper-color-panels","provider":"paper","motionModel":"procedural","supportsPngSnapshot":true,"supportsEditableSeek":true,"loop":{"kind":"continuous","periodMs":null}}},{"description":"Layered color bands twisted into a soft animated vortex. Paper’s 007 preset.","engine":"Paper Shaders","id":"paper-swirl-007","name":"Swirl · 007","qualityScore":75,"sourceLabel":"Paper · Apache-2.0","sourceUrl":"https://github.com/paper-design/shaders","category":"fluid","kind":"backgrounds","motion":{"materialId":"paper-swirl-007","provider":"paper","motionModel":"procedural","supportsPngSnapshot":true,"supportsEditableSeek":true,"loop":{"kind":"continuous","periodMs":null}}},{"description":"Dimensional translucent color planes with animated depth. Paper’s Glass preset.","engine":"Paper Shaders","id":"paper-color-panels-glass","name":"Color Panels · Glass","qualityScore":73,"sourceLabel":"Paper · Apache-2.0","sourceUrl":"https://github.com/paper-design/shaders","category":"metal","kind":"backgrounds","motion":{"materialId":"paper-color-panels-glass","provider":"paper","motionModel":"procedural","supportsPngSnapshot":true,"supportsEditableSeek":true,"loop":{"kind":"continuous","periodMs":null}}},{"description":"Layered color bands twisted into a soft animated vortex. Paper’s Candy preset.","engine":"Paper Shaders","id":"paper-swirl-candy","name":"Swirl · Candy","qualityScore":75,"sourceLabel":"Paper · Apache-2.0","sourceUrl":"https://github.com/paper-design/shaders","category":"fluid","kind":"backgrounds","motion":{"materialId":"paper-swirl-candy","provider":"paper","motionModel":"procedural","supportsPngSnapshot":true,"supportsEditableSeek":true,"loop":{"kind":"continuous","periodMs":null}}},{"description":"Dimensional translucent color planes with animated depth. Paper’s Gradient preset.","engine":"Paper Shaders","id":"paper-color-panels-gradient","name":"Color Panels · Gradient","qualityScore":73,"sourceLabel":"Paper · Apache-2.0","sourceUrl":"https://github.com/paper-design/shaders","category":"gradient","kind":"backgrounds","motion":{"materialId":"paper-color-panels-gradient","provider":"paper","motionModel":"procedural","supportsPngSnapshot":true,"supportsEditableSeek":true,"loop":{"kind":"continuous","periodMs":null}}},{"description":"Layered color bands twisted into a soft animated vortex. Paper’s Opening preset.","engine":"Paper Shaders","id":"paper-swirl-opening","name":"Swirl · Opening","qualityScore":75,"sourceLabel":"Paper · Apache-2.0","sourceUrl":"https://github.com/paper-design/shaders","category":"fluid","kind":"backgrounds","motion":{"materialId":"paper-swirl-opening","provider":"paper","motionModel":"procedural","supportsPngSnapshot":true,"supportsEditableSeek":true,"loop":{"kind":"continuous","periodMs":null}}},{"description":"Dimensional translucent color planes with animated depth. Paper’s Opening preset.","engine":"Paper Shaders","id":"paper-color-panels-opening","name":"Color Panels · Opening","qualityScore":73,"sourceLabel":"Paper · Apache-2.0","sourceUrl":"https://github.com/paper-design/shaders","category":"gradient","kind":"backgrounds","motion":{"materialId":"paper-color-panels-opening","provider":"paper","motionModel":"procedural","supportsPngSnapshot":true,"supportsEditableSeek":true,"loop":{"kind":"continuous","periodMs":null}}},{"description":"Ordered GPU dithering over animated procedural fields. Paper’s Default preset.","engine":"Paper Shaders","id":"paper-dithering","name":"Dithering","qualityScore":70.8,"sourceLabel":"Paper · Apache-2.0","sourceUrl":"https://github.com/paper-design/shaders","category":"light","kind":"backgrounds","motion":{"materialId":"paper-dithering","provider":"paper","motionModel":"procedural","supportsPngSnapshot":true,"supportsEditableSeek":true,"loop":{"kind":"continuous","periodMs":null}}},{"description":"Thermal contour mapping with glow, depth, and atmospheric noise. Paper’s Default preset.","engine":"Paper Shaders","id":"paper-heatmap","name":"Heatmap","qualityScore":67.8,"sourceLabel":"Paper · Apache-2.0","sourceUrl":"https://github.com/paper-design/shaders","category":"graphic","kind":"backgrounds","motion":{"materialId":"paper-heatmap","provider":"paper","motionModel":"procedural","supportsPngSnapshot":true,"supportsEditableSeek":true,"loop":{"kind":"continuous","periodMs":null}}},{"description":"Ordered GPU dithering over animated procedural fields. Paper’s Bugs preset.","engine":"Paper Shaders","id":"paper-dithering-bugs","name":"Dithering · Bugs","qualityScore":70,"sourceLabel":"Paper · Apache-2.0","sourceUrl":"https://github.com/paper-design/shaders","category":"light","kind":"backgrounds","motion":{"materialId":"paper-dithering-bugs","provider":"paper","motionModel":"procedural","supportsPngSnapshot":true,"supportsEditableSeek":true,"loop":{"kind":"continuous","periodMs":null}}},{"description":"Thermal contour mapping with glow, depth, and atmospheric noise. Paper’s Sepia preset.","engine":"Paper Shaders","id":"paper-heatmap-sepia","name":"Heatmap · Sepia","qualityScore":67,"sourceLabel":"Paper · Apache-2.0","sourceUrl":"https://github.com/paper-design/shaders","category":"graphic","kind":"backgrounds","motion":{"materialId":"paper-heatmap-sepia","provider":"paper","motionModel":"procedural","supportsPngSnapshot":true,"supportsEditableSeek":true,"loop":{"kind":"continuous","periodMs":null}}},{"description":"Ordered GPU dithering over animated procedural fields. Paper’s Ripple preset.","engine":"Paper Shaders","id":"paper-dithering-ripple","name":"Dithering · Ripple","qualityScore":70,"sourceLabel":"Paper · Apache-2.0","sourceUrl":"https://github.com/paper-design/shaders","category":"light","kind":"backgrounds","motion":{"materialId":"paper-dithering-ripple","provider":"paper","motionModel":"procedural","supportsPngSnapshot":true,"supportsEditableSeek":true,"loop":{"kind":"analytic-candidate","providerTimePeriod":4.1887902047863905,"providerTimeUnit":"seconds","requiresPresetShape":"ripple","pixelVerified":false}}},{"description":"Image refraction through animated fluted and folded glass. Paper’s Default preset.","engine":"Paper Shaders","id":"paper-fluted-glass","name":"Fluted Glass","qualityScore":65.8,"sourceLabel":"Paper · Apache-2.0","sourceUrl":"https://github.com/paper-design/shaders","category":"metal","kind":"backgrounds","motion":{"materialId":"paper-fluted-glass","provider":"paper","motionModel":"static","supportsPngSnapshot":true,"supportsEditableSeek":false,"loop":{"kind":"static"}}},{"description":"Ordered GPU dithering over animated procedural fields. Paper’s Sine Wave preset.","engine":"Paper Shaders","id":"paper-dithering-sine-wave","name":"Dithering · Sine Wave","qualityScore":70,"sourceLabel":"Paper · Apache-2.0","sourceUrl":"https://github.com/paper-design/shaders","category":"light","kind":"backgrounds","motion":{"materialId":"paper-dithering-sine-wave","provider":"paper","motionModel":"procedural","supportsPngSnapshot":true,"supportsEditableSeek":true,"loop":{"kind":"analytic-candidate","providerTimePeriod":12.566370614359172,"providerTimeUnit":"seconds","requiresPresetShape":"wave","pixelVerified":false}}},{"description":"Image refraction through animated fluted and folded glass. Paper’s Abstract preset.","engine":"Paper Shaders","id":"paper-fluted-glass-abstract","name":"Fluted Glass · Abstract","qualityScore":65,"sourceLabel":"Paper · Apache-2.0","sourceUrl":"https://github.com/paper-design/shaders","category":"metal","kind":"backgrounds","motion":{"materialId":"paper-fluted-glass-abstract","provider":"paper","motionModel":"static","supportsPngSnapshot":true,"supportsEditableSeek":false,"loop":{"kind":"static"}}},{"description":"Ordered GPU dithering over animated procedural fields. Paper’s Swirl preset.","engine":"Paper Shaders","id":"paper-dithering-swirl","name":"Dithering · Swirl","qualityScore":70,"sourceLabel":"Paper · Apache-2.0","sourceUrl":"https://github.com/paper-design/shaders","category":"fluid","kind":"backgrounds","motion":{"materialId":"paper-dithering-swirl","provider":"paper","motionModel":"procedural","supportsPngSnapshot":true,"supportsEditableSeek":true,"loop":{"kind":"analytic-candidate","providerTimePeriod":3.141592653589793,"providerTimeUnit":"seconds","requiresPresetShape":"swirl","pixelVerified":false}}},{"description":"Image refraction through animated fluted and folded glass. Paper’s Folds preset.","engine":"Paper Shaders","id":"paper-fluted-glass-folds","name":"Fluted Glass · Folds","qualityScore":65,"sourceLabel":"Paper · Apache-2.0","sourceUrl":"https://github.com/paper-design/shaders","category":"metal","kind":"backgrounds","motion":{"materialId":"paper-fluted-glass-folds","provider":"paper","motionModel":"static","supportsPngSnapshot":true,"supportsEditableSeek":false,"loop":{"kind":"static"}}},{"description":"Ordered GPU dithering over animated procedural fields. Paper’s Warp preset.","engine":"Paper Shaders","id":"paper-dithering-warp","name":"Dithering · Warp","qualityScore":70,"sourceLabel":"Paper · Apache-2.0","sourceUrl":"https://github.com/paper-design/shaders","category":"fluid","kind":"backgrounds","motion":{"materialId":"paper-dithering-warp","provider":"paper","motionModel":"procedural","supportsPngSnapshot":true,"supportsEditableSeek":true,"loop":{"kind":"continuous","periodMs":null}}},{"description":"Image refraction through animated fluted and folded glass. Paper’s Waves preset.","engine":"Paper Shaders","id":"paper-fluted-glass-waves","name":"Fluted Glass · Waves","qualityScore":65,"sourceLabel":"Paper · Apache-2.0","sourceUrl":"https://github.com/paper-design/shaders","category":"metal","kind":"backgrounds","motion":{"materialId":"paper-fluted-glass-waves","provider":"paper","motionModel":"static","supportsPngSnapshot":true,"supportsEditableSeek":false,"loop":{"kind":"static"}}},{"id":"shader-effects-cursor-trail","name":"Cursor Trail","description":"Animated trail effect that tracks cursor movement · Interactive","engine":"Shaders.com WebGPU","qualityScore":62.5,"sourceLabel":"Shaders.com · MIT","sourceUrl":"https://github.com/shader-effects-inc/shaders","category":"light","kind":"interactive","motion":{"materialId":"shader-effects-cursor-trail","provider":"webgpu","motionModel":"stateful","supportsPngSnapshot":true,"supportsEditableSeek":false,"loop":{"kind":"continuous","periodMs":null}},"nativeControls":{"colorA":{"default":"#00aaff","type":"color","label":"Start Color","group":"Colors","palette":"main"},"colorB":{"default":"#ff00aa","type":"color","label":"End Color","group":"Colors","palette":"highlight"},"stops":{"default":null,"type":"gradient-stops","label":"Colors","group":"Colors"},"radius":{"default":0.5,"type":"range","min":0.5,"max":2,"step":0.1,"label":"Radius","group":"Effect"},"length":{"default":0.5,"type":"range","min":0.1,"max":2,"step":0.1,"label":"Trail Length","group":"Animation"},"shrink":{"default":1,"type":"range","min":0,"max":1,"step":0.1,"label":"Shrink Amount","group":"Effect"},"softness":{"default":0,"type":["range","map"],"min":0,"max":1,"step":0.01,"label":"Softness","group":"Effect"},"colorSpace":{"default":"linear","type":"select","options":[{"label":"Linear RGB","value":"linear"},{"label":"OKLCh","value":"oklch"},{"label":"OKLAB","value":"oklab"},{"label":"HSL","value":"hsl"},{"label":"HSV","value":"hsv"},{"label":"LCH","value":"lch"}],"label":"Color Space","group":"Colors"}},"settingsKey":"effectProps","requiresWebGPU":true},{"id":"shader-effects-multi-point-gradient","name":"Multi Point Gradient","description":"Five individually placed color points blended together by proximity — drag each point to shape the gradient · Textures","engine":"Shaders.com WebGPU","qualityScore":84.6,"sourceLabel":"Shaders.com · MIT","sourceUrl":"https://github.com/shader-effects-inc/shaders","category":"gradient","kind":"backgrounds","motion":{"materialId":"shader-effects-multi-point-gradient","provider":"webgpu","motionModel":"procedural","supportsPngSnapshot":true,"supportsEditableSeek":true,"loop":{"kind":"continuous","periodMs":null}},"nativeControls":{"colorA":{"default":"#4776E6","type":"color","label":"Color A","group":"Colors","palette":"base"},"positionA":{"default":{"x":0.2,"y":0.2},"type":"position","label":"Position A","group":"Position"},"colorB":{"default":"#C44DFF","type":"color","label":"Color B","group":"Colors","palette":"main"},"positionB":{"default":{"x":0.8,"y":0.2},"type":"position","label":"Position B","group":"Position"},"colorC":{"default":"#1ABC9C","type":"color","label":"Color C","group":"Colors","palette":"highlight"},"positionC":{"default":{"x":0.2,"y":0.8},"type":"position","label":"Position C","group":"Position"},"colorD":{"default":"#F8BBD9","type":"color","label":"Color D","group":"Colors","palette":"base"},"positionD":{"default":{"x":0.8,"y":0.8},"type":"position","label":"Position D","group":"Position"},"colorE":{"default":"#FF8C42","type":"color","label":"Color E","group":"Colors","palette":"main"},"positionE":{"default":{"x":0.5,"y":0.5},"type":"position","label":"Position E","group":"Position"},"colorSpace":{"default":"linear","type":"select","options":[{"label":"Linear RGB","value":"linear"},{"label":"OKLCh","value":"oklch"},{"label":"OKLAB","value":"oklab"},{"label":"HSL","value":"hsl"},{"label":"HSV","value":"hsv"},{"label":"LCH","value":"lch"}],"label":"Color Space","group":"Colors"},"smoothness":{"default":2,"type":["range","map"],"min":0,"max":5,"step":0.01,"label":"Smoothness","group":"Effect"}},"settingsKey":"effectProps","requiresWebGPU":true},{"id":"shader-effects-waveform","name":"Waveform","description":"Audio-visualizer waveform — equalizer bars, a filled wave, an oscilloscope line, or a dot matrix — driven by a simulated signal whose amplitude you can map to your own audio level · Textures","engine":"Shaders.com WebGPU","qualityScore":84.5,"sourceLabel":"Shaders.com · MIT","sourceUrl":"https://github.com/shader-effects-inc/shaders","category":"gradient","kind":"backgrounds","motion":{"materialId":"shader-effects-waveform","provider":"webgpu","motionModel":"procedural","supportsPngSnapshot":true,"supportsEditableSeek":true,"loop":{"kind":"continuous","periodMs":null}},"nativeControls":{"style":{"default":"bars","type":"select","options":[{"label":"Bars","value":"bars"},{"label":"Wave","value":"wave"},{"label":"Line","value":"line"},{"label":"Dots","value":"dots"}],"label":"Style","group":"Style"},"colorA":{"default":"#3b5bff","type":"color","label":"Color A","group":"Colors","palette":"main"},"colorB":{"default":"#ff3bd4","type":"color","label":"Color B","group":"Colors","palette":"highlight"},"stops":{"default":null,"type":"gradient-stops","label":"Colors","group":"Colors"},"colorSpace":{"default":"oklab","type":"select","options":[{"label":"Linear RGB","value":"linear"},{"label":"OKLCh","value":"oklch"},{"label":"OKLAB","value":"oklab"},{"label":"HSL","value":"hsl"},{"label":"HSV","value":"hsv"},{"label":"LCH","value":"lch"}],"label":"Color Space","group":"Colors"},"from":{"default":{"x":0,"y":0.5},"type":"position","label":"Start","group":"Position","units":["%","px"]},"to":{"default":{"x":1,"y":0.5},"type":"position","label":"End","group":"Position","units":["%","px"]},"amplitude":{"default":1,"type":["range","map"],"min":0,"max":2,"step":0.01,"label":"Amplitude","group":"Signal"},"frequency":{"default":1,"type":["range","map"],"min":0.2,"max":3,"step":0.01,"label":"Frequency","group":"Signal"},"height":{"default":0.6,"type":["range","map"],"min":0.05,"max":1,"step":0.01,"label":"Height","group":"Effect"},"align":{"default":"mirrored","type":"select","options":[{"label":"Mirrored","value":"mirrored"},{"label":"Top","value":"top"},{"label":"Bottom","value":"bottom"}],"label":"Align","group":"Effect"},"count":{"default":32,"type":["range","map"],"min":4,"max":128,"step":1,"label":"Count","group":"Effect","condition":{"style":["bars","dots"]}},"barWidth":{"default":0.6,"type":["range","map"],"min":0.1,"max":1,"step":0.01,"label":"Bar Width","group":"Effect","condition":{"style":"bars"}},"rounding":{"default":1,"type":["range","map"],"min":0,"max":1,"step":0.01,"label":"Rounding","group":"Effect","condition":{"style":"bars"}},"dotSize":{"default":0.7,"type":["range","map"],"min":0.2,"max":1,"step":0.01,"label":"Dot Size","group":"Effect","condition":{"style":"dots"}},"lineWidth":{"default":0.006,"type":["range","map"],"min":0.001,"max":0.05,"step":0.001,"label":"Line Width","group":"Effect","dimensional":"canvas-height","condition":{"style":"line"}},"softness":{"default":0,"type":["range","map"],"min":0,"max":1,"step":0.01,"label":"Softness","group":"Effect","condition":{"style":"wave"}},"speed":{"default":1,"type":"range","min":0,"max":3,"step":0.01,"label":"Speed","group":"Animation","hidden":true},"seed":{"default":1,"type":"range","min":0,"max":100,"step":1,"label":"Seed","group":"Animation"}},"settingsKey":"effectProps","requiresWebGPU":true},{"id":"shader-effects-sun-burst","name":"Sun Burst","description":"Radial sunburst rays emanating from a center point · Textures","engine":"Shaders.com WebGPU","qualityScore":84.2,"sourceLabel":"Shaders.com · MIT","sourceUrl":"https://github.com/shader-effects-inc/shaders","category":"light","kind":"backgrounds","motion":{"materialId":"shader-effects-sun-burst","provider":"webgpu","motionModel":"procedural","supportsPngSnapshot":true,"supportsEditableSeek":true,"loop":{"kind":"continuous","periodMs":null}},"nativeControls":{"color":{"default":"#ffdd88","type":"color","label":"Color","group":"Colors","palette":"main"},"background":{"default":"#000000","type":"color","label":"Background","group":"Colors","palette":"base"},"center":{"default":{"x":0.5,"y":0.5},"type":"position","label":"Center","group":"Position"},"rayCount":{"default":12,"type":"range","min":3,"max":64,"step":1,"label":"Ray Count","group":"Effect"},"softness":{"default":0.3,"type":["range","map"],"min":0,"max":1,"step":0.01,"label":"Softness","group":"Effect"},"radius":{"default":0.8,"type":["range","map"],"min":0,"max":1.2,"step":0.01,"label":"Radius","group":"Effect"},"feather":{"default":0.5,"type":["range","map"],"min":0,"max":5,"step":0.01,"label":"Feather","group":"Effect"},"speed":{"default":0.2,"type":"range","min":-2,"max":2,"step":0.1,"label":"Speed","group":"Animation","hidden":true}},"settingsKey":"effectProps","requiresWebGPU":true},{"id":"shader-effects-carbon-fiber","name":"Carbon Fiber","description":"Photorealistic woven carbon fibre — interlaced tows whose anisotropic sheen flips ninety degrees cell to cell, raised into a quilted weave and finished with a glossy clearcoat that mirrors the studio. Plain or twill, in any shape. · Shape Effects","engine":"Shaders.com WebGPU","qualityScore":84.1,"sourceLabel":"Shaders.com · MIT","sourceUrl":"https://github.com/shader-effects-inc/shaders","category":"metal","kind":"backgrounds","motion":{"materialId":"shader-effects-carbon-fiber","provider":"webgpu","motionModel":"procedural","supportsPngSnapshot":true,"supportsEditableSeek":true,"loop":{"kind":"continuous","periodMs":null}},"nativeControls":{"surface":{"type":"select","label":"Surface","group":"Framing","default":"canvas","options":[{"label":"Full canvas","value":"canvas"},{"label":"Shape","value":"shape"}]},"origin":{"default":"center","type":"origin","label":"Origin","group":"Position"},"center":{"default":{"x":0.5,"y":0.5},"type":"position","label":"Center","group":"Position","units":["%","px"]},"scale":{"default":1,"type":"range","min":0.1,"max":3,"step":0.01,"label":"Scale","group":"Position"},"rotation":{"default":0,"type":"range","min":0,"max":360,"step":1,"label":"Rotation","group":"Position"},"lightColor":{"default":"#b9bdc6","type":"color","label":"Fiber Sheen","group":"Carbon","palette":"highlight"},"darkColor":{"default":"#0b0c0e","type":"color","label":"Resin Color","group":"Carbon","palette":"base"},"weaveStyle":{"default":"twill","type":"select","options":[{"label":"Twill (2×2)","value":"twill"},{"label":"Plain","value":"plain"}],"label":"Weave","group":"Carbon"},"weaveScale":{"default":30,"type":"range","min":2,"max":50,"step":0.5,"label":"Weave Scale","group":"Carbon"},"weaveAngle":{"default":0,"type":"range","min":0,"max":360,"step":1,"label":"Weave Angle","group":"Carbon"},"relief":{"default":0.5,"type":"range","min":0,"max":1,"step":0.01,"label":"Weave Depth","group":"Carbon"},"fiberSheen":{"default":1.2,"type":"range","min":0,"max":1.5,"step":0.01,"label":"Fiber Sheen","group":"Carbon"},"roughness":{"default":0.5,"type":"range","min":0,"max":1,"step":0.01,"label":"Roughness","group":"Surface"},"clearcoat":{"default":1.2,"type":"range","min":0,"max":2,"step":0.01,"label":"Clearcoat","group":"Surface"},"environment":{"default":2,"type":["range","map"],"min":0,"max":2,"step":0.01,"label":"Environment","group":"Surface"},"envRotation":{"default":0,"type":"range","min":0,"max":360,"step":1,"label":"Env Rotation","group":"Surface"},"lightAngle":{"default":215,"type":"range","min":0,"max":360,"step":1,"label":"Light Angle","group":"Surface"},"bevelWidth":{"default":0.05,"type":["range","map"],"min":0.005,"max":0.2,"step":0.001,"label":"Bevel Width","group":"Surface"},"bevelShape":{"default":0,"type":["range","map"],"min":0,"max":1,"step":0.01,"label":"Bevel Profile","group":"Surface"},"edgeSoftness":{"default":0.05,"type":["range","map"],"min":0,"max":1,"step":0.01,"label":"Edge Softness","group":"Surface"},"shape":{"default":"{\"type\":\"sphere3D\",\"radius\":0.35}","type":"shape","label":"Shape","group":"Shape"},"shapeSdfUrl":{"default":""},"shapeType":{"default":""}},"settingsKey":"effectProps","requiresWebGPU":true},{"id":"shader-effects-heatmap","name":"Heatmap","description":"Thermal-camera heat flowing through any 2D, SVG, or 3D shape. Powered by Paper Shaders. · Shape Effects","engine":"Shaders.com WebGPU","qualityScore":84,"sourceLabel":"Shaders.com · MIT","sourceUrl":"https://github.com/shader-effects-inc/shaders","category":"gradient","kind":"backgrounds","motion":{"materialId":"shader-effects-heatmap","provider":"webgpu","motionModel":"procedural","supportsPngSnapshot":true,"supportsEditableSeek":true,"loop":{"kind":"continuous","periodMs":null}},"nativeControls":{"surface":{"type":"select","label":"Surface","group":"Framing","default":"canvas","options":[{"label":"Full canvas","value":"canvas"},{"label":"Shape","value":"shape"}]},"origin":{"default":"center","type":"origin","label":"Origin","group":"Position"},"center":{"default":{"x":0.5,"y":0.5},"type":"position","label":"Center","group":"Position","units":["%","px"]},"scale":{"default":1,"type":"range","min":0.1,"max":3,"step":0.01,"label":"Scale","group":"Position"},"rotation":{"default":0,"type":"range","min":0,"max":360,"step":1,"label":"Rotation","group":"Position"},"colorA":{"default":"#02010f","type":"color","label":"Color A","group":"Colors","palette":"base"},"colorB":{"default":"#f9e25f","type":"color","label":"Color B","group":"Colors","palette":"highlight"},"stops":{"default":[{"color":"#02010f","position":0},{"color":"#2a0a8a","position":0.2},{"color":"#a41c9b","position":0.45},{"color":"#e8632b","position":0.7},{"color":"#f9e25f","position":0.9},{"color":"#ffffff","position":1}],"type":"gradient-stops","label":"Colors","group":"Colors","palette":"ramp"},"colorSpace":{"default":"oklab","type":"select","options":[{"label":"Linear RGB","value":"linear"},{"label":"OKLCh","value":"oklch"},{"label":"OKLAB","value":"oklab"},{"label":"HSL","value":"hsl"},{"label":"HSV","value":"hsv"},{"label":"LCH","value":"lch"}],"label":"Color Space","group":"Colors"},"innerGlow":{"default":0.4,"type":["range","map"],"min":0,"max":1,"step":0.01,"label":"Inner Glow","group":"Heat"},"outerGlow":{"default":0.2,"type":["range","map"],"min":0,"max":1,"step":0.01,"label":"Outer Glow","group":"Heat"},"contour":{"default":0.5,"type":["range","map"],"min":0,"max":1,"step":0.01,"label":"Contour","group":"Heat"},"angle":{"default":90,"type":"range","min":0,"max":360,"step":1,"label":"Angle","group":"Heat"},"speed":{"default":1,"type":"range","min":0,"max":4,"step":0.01,"label":"Speed","group":"Heat","hidden":true},"shape":{"default":"{\"type\":\"sphere3D\",\"radius\":0.35}","type":"shape","label":"Shape","group":"Shape"},"shapeSdfUrl":{"default":""},"shapeType":{"default":""}},"settingsKey":"effectProps","requiresWebGPU":true},{"id":"shader-effects-curl-noise","name":"Curl Noise","description":"Swirling divergence-free flow field that drifts over time · Textures","engine":"Shaders.com WebGPU","qualityScore":80,"sourceLabel":"Shaders.com · MIT","sourceUrl":"https://github.com/shader-effects-inc/shaders","category":"fluid","kind":"backgrounds","motion":{"materialId":"shader-effects-curl-noise","provider":"webgpu","motionModel":"procedural","supportsPngSnapshot":true,"supportsEditableSeek":true,"loop":{"kind":"continuous","periodMs":null}},"nativeControls":{"colorA":{"default":"#ffffff","type":"color","label":"Color A","group":"Colors","palette":"base"},"colorB":{"default":"#000000","type":"color","label":"Color B","group":"Colors","palette":"main"},"stops":{"default":null,"type":"gradient-stops","label":"Colors","group":"Colors"},"colorSpace":{"default":"linear","type":"select","options":[{"label":"Linear RGB","value":"linear"},{"label":"OKLCh","value":"oklch"},{"label":"OKLAB","value":"oklab"},{"label":"HSL","value":"hsl"},{"label":"HSV","value":"hsv"},{"label":"LCH","value":"lch"}],"label":"Color Space","group":"Colors"},"scale":{"default":2,"type":"range","min":-2,"max":5,"step":0.1,"label":"Scale","group":"Effect"},"contrast":{"default":0,"type":["range","map"],"min":-1,"max":5,"step":0.1,"label":"Contrast","group":"Effect"},"balance":{"default":0,"type":["range","map"],"min":-1,"max":1,"step":0.05,"label":"Balance","group":"Effect"},"seed":{"default":0,"type":"range","min":0,"max":100,"step":1,"label":"Seed","group":"Effect"},"speed":{"default":1,"type":"range","min":0,"max":5,"step":0.1,"label":"Speed","group":"Animation","hidden":true}},"settingsKey":"effectProps","requiresWebGPU":true},{"id":"shader-effects-voronoi","name":"Voronoi","description":"Cellular pattern where each pixel is colored by its distance to the nearest of many scattered points · Textures","engine":"Shaders.com WebGPU","qualityScore":79.9,"sourceLabel":"Shaders.com · MIT","sourceUrl":"https://github.com/shader-effects-inc/shaders","category":"gradient","kind":"backgrounds","motion":{"materialId":"shader-effects-voronoi","provider":"webgpu","motionModel":"procedural","supportsPngSnapshot":true,"supportsEditableSeek":true,"loop":{"kind":"continuous","periodMs":null}},"nativeControls":{"colorA":{"default":"#3186cf","type":"color","label":"Color A (Center)","group":"Colors","palette":"main"},"colorB":{"default":"#fc02dd","type":"color","label":"Color B (Edge)","group":"Colors","palette":"highlight"},"stops":{"default":null,"type":"gradient-stops","label":"Colors","group":"Colors"},"colorBorder":{"default":"#000000","type":"color","label":"Border Color","group":"Colors","palette":"base"},"scale":{"default":6,"type":["range","map"],"min":1,"max":20,"step":0.5,"label":"Scale","group":"Effect"},"speed":{"default":0.5,"type":"range","min":0,"max":5,"step":0.1,"label":"Speed","group":"Animation","hidden":true},"seed":{"default":0,"type":["range","map"],"min":0,"max":100,"step":1,"label":"Seed","group":"Effect"},"edgeIntensity":{"default":0.5,"type":["range","map"],"min":0,"max":1,"step":0.01,"label":"Edge Intensity","group":"Effect"},"edgeSoftness":{"default":0.05,"type":["range","map"],"min":0,"max":0.4,"step":0.005,"label":"Edge Softness","group":"Effect"},"colorSpace":{"default":"linear","type":"select","options":[{"label":"Linear RGB","value":"linear"},{"label":"OKLCh","value":"oklch"},{"label":"OKLAB","value":"oklab"},{"label":"HSL","value":"hsl"},{"label":"HSV","value":"hsv"},{"label":"LCH","value":"lch"}],"label":"Color Space","group":"Colors"}},"settingsKey":"effectProps","requiresWebGPU":true},{"id":"shader-effects-ripples","name":"Ripples","description":"Concentric animated ripples emanating from a point · Textures","engine":"Shaders.com WebGPU","qualityScore":79.8,"sourceLabel":"Shaders.com · MIT","sourceUrl":"https://github.com/shader-effects-inc/shaders","category":"fluid","kind":"backgrounds","motion":{"materialId":"shader-effects-ripples","provider":"webgpu","motionModel":"procedural","supportsPngSnapshot":true,"supportsEditableSeek":true,"loop":{"kind":"continuous","periodMs":null}},"nativeControls":{"center":{"default":{"x":0.5,"y":0.5},"type":"position","label":"Center","group":"Position"},"colorA":{"default":"#ffffff","type":"color","label":"Color A","group":"Colors","palette":"base"},"colorB":{"default":"#000000","type":"color","label":"Color B","group":"Colors","palette":"main"},"speed":{"default":1,"type":"range","min":-5,"max":5,"step":0.1,"label":"Speed","group":"Animation","hidden":true},"frequency":{"default":20,"type":["range","map"],"min":1,"max":80,"step":0.1,"label":"Frequency","group":"Effect"},"softness":{"default":0,"type":["range","map"],"min":0,"max":3,"step":0.1,"label":"Softness","group":"Effect"},"thickness":{"default":0.5,"type":["range","map"],"min":0,"max":1,"step":0.1,"label":"Thickness","group":"Effect"},"phase":{"default":0,"type":["range","map"],"min":0,"max":6.28,"step":0.1,"label":"Phase","group":"Animation"}},"settingsKey":"effectProps","requiresWebGPU":true},{"id":"shader-effects-conic-gradient","name":"Conic Gradient","description":"Colors sweep in a full circle around a center point, like a color wheel · Textures","engine":"Shaders.com WebGPU","qualityScore":79.7,"sourceLabel":"Shaders.com · MIT","sourceUrl":"https://github.com/shader-effects-inc/shaders","category":"gradient","kind":"backgrounds","motion":{"materialId":"shader-effects-conic-gradient","provider":"webgpu","motionModel":"procedural","supportsPngSnapshot":true,"supportsEditableSeek":true,"loop":{"kind":"continuous","periodMs":null}},"nativeControls":{"colorA":{"default":"#FF0080","type":"color","label":"Color A","group":"Colors","palette":"base"},"colorB":{"default":"#00BFFF","type":"color","label":"Color B","group":"Colors","palette":"main"},"stops":{"default":null,"type":"gradient-stops","label":"Colors","group":"Colors"},"center":{"default":{"x":0.5,"y":0.5},"type":"position","label":"Center","group":"Position"},"rotation":{"default":0,"type":["range","map"],"min":0,"max":360,"step":1,"label":"Rotation","group":"Effect"},"repeat":{"default":1,"type":["range","map"],"min":1,"max":24,"step":1,"label":"Repeat","group":"Effect"},"colorSpace":{"default":"linear","type":"select","options":[{"label":"Linear RGB","value":"linear"},{"label":"OKLCh","value":"oklch"},{"label":"OKLAB","value":"oklab"},{"label":"HSL","value":"hsl"},{"label":"HSV","value":"hsv"},{"label":"LCH","value":"lch"}],"label":"Color Space","group":"Colors"}},"settingsKey":"effectProps","requiresWebGPU":true},{"id":"shader-effects-voxels","name":"Voxels","description":"Rebuild any shape out of voxels — a flat shape becomes chunky pixel art, a 3D shape a lit voxel model with smooth ambient occlusion, cast shadows, a key light you can orbit or drive, and per-cube color · Shape Effects","engine":"Shaders.com WebGPU","qualityScore":79.6,"sourceLabel":"Shaders.com · MIT","sourceUrl":"https://github.com/shader-effects-inc/shaders","category":"graphic","kind":"backgrounds","motion":{"materialId":"shader-effects-voxels","provider":"webgpu","motionModel":"procedural","supportsPngSnapshot":true,"supportsEditableSeek":true,"loop":{"kind":"continuous","periodMs":null}},"nativeControls":{"surface":{"type":"select","label":"Surface","group":"Framing","default":"canvas","options":[{"label":"Full canvas","value":"canvas"},{"label":"Shape","value":"shape"}]},"origin":{"default":"center","type":"origin","label":"Origin","group":"Position"},"center":{"default":{"x":0.5,"y":0.5},"type":"position","label":"Center","group":"Position","units":["%","px"]},"scale":{"default":1,"type":"range","min":0.1,"max":3,"step":0.01,"label":"Scale","group":"Position"},"rotation":{"default":0,"type":"range","min":0,"max":360,"step":1,"label":"Rotation","group":"Position"},"voxelSize":{"default":0.035,"type":"range","min":0.006,"max":0.15,"step":0.001,"label":"Voxel Size","group":"Voxels"},"voxelShape":{"default":"cube","type":"select","options":[{"label":"Cube","value":"cube"},{"label":"Rounded Cube","value":"rounded"},{"label":"Sphere","value":"sphere"}],"label":"Voxel Shape","group":"Voxels"},"voxelScale":{"default":1,"type":"range","min":0.3,"max":1,"step":0.01,"label":"Voxel Fill","group":"Voxels"},"fill":{"default":0,"type":"range","min":-0.5,"max":0.5,"step":0.01,"label":"Surface Bias","group":"Voxels"},"bevel":{"default":0.08,"type":"range","min":0,"max":1,"step":0.01,"label":"Bevel","group":"Voxels"},"depth":{"default":0.12,"type":"range","min":0.01,"max":0.6,"step":0.005,"label":"Depth","group":"Voxels"},"gridSpace":{"default":"shape","type":"select","options":[{"label":"Model","value":"shape"},{"label":"Screen","value":"view"}],"label":"Grid","group":"Voxels"},"colorA":{"default":"#6ea8ff","type":"color","label":"Color A","group":"Colors","palette":"main"},"colorB":{"default":"#1d2b4f","type":"color","label":"Color B","group":"Colors","palette":"base"},"colorMode":{"default":"height","type":"select","options":[{"label":"Solid","value":"solid"},{"label":"Height","value":"height"},{"label":"Depth","value":"depth"},{"label":"Random","value":"random"},{"label":"Top / Sides","value":"faces"}],"label":"Palette","group":"Colors"},"colorVariation":{"default":0.25,"type":["range","map"],"min":0,"max":1,"step":0.01,"label":"Variation","group":"Colors"},"colorSpace":{"default":"oklab","type":"select","options":[{"label":"Linear RGB","value":"linear"},{"label":"OKLCh","value":"oklch"},{"label":"OKLAB","value":"oklab"},{"label":"HSL","value":"hsl"},{"label":"HSV","value":"hsv"},{"label":"LCH","value":"lch"}],"label":"Color Space","group":"Colors"},"lightAngle":{"default":225,"type":["range","map"],"min":0,"max":360,"step":1,"label":"Light Angle","group":"Light"},"lightElevation":{"default":42,"type":["range","map"],"min":5,"max":85,"step":1,"label":"Light Elevation","group":"Light"},"lightColor":{"default":"#fff2df","type":"color","label":"Light Color","group":"Light","palette":"highlight"},"lightIntensity":{"default":1.1,"type":["range","map"],"min":0,"max":3,"step":0.01,"label":"Light Intensity","group":"Light"},"ambientColor":{"default":"#9fb4d8","type":"color","label":"Ambient Color","group":"Light","palette":"base"},"ambient":{"default":0.55,"type":["range","map"],"min":0,"max":2,"step":0.01,"label":"Ambient","group":"Light"},"shadows":{"default":0.85,"type":["range","map"],"min":0,"max":1,"step":0.01,"label":"Shadows","group":"Light"},"shadowSoftness":{"default":0.35,"type":["range","map"],"min":0,"max":1,"step":0.01,"label":"Shadow Softness","group":"Light"},"ao":{"default":1,"type":["range","map"],"min":0,"max":2,"step":0.01,"label":"Occlusion","group":"Light"},"glossiness":{"default":0.35,"type":["range","map"],"min":0,"max":1,"step":0.01,"label":"Glossiness","group":"Surface"},"specular":{"default":0.6,"type":["range","map"],"min":0,"max":2,"step":0.01,"label":"Specular","group":"Surface"},"seams":{"default":0.2,"type":["range","map"],"min":0,"max":1,"step":0.01,"label":"Seams","group":"Surface"},"shape":{"default":"{\"type\":\"sphere3D\",\"radius\":0.35}","type":"shape","label":"Shape","group":"Shape"},"shapeSdfUrl":{"default":""},"shapeType":{"default":""}},"settingsKey":"effectProps","requiresWebGPU":true},{"id":"shader-effects-particles","name":"Particles","description":"A swarm of simulated particles that settles into the shape, filling it evenly — flat, SVG or true 3D volumes — scattering from the cursor (or chasing it), tumbling when the shape moves, and always drifting back home · Shape Effects","engine":"Shaders.com WebGPU","qualityScore":79.4,"sourceLabel":"Shaders.com · MIT","sourceUrl":"https://github.com/shader-effects-inc/shaders","category":"fluid","kind":"backgrounds","motion":{"materialId":"shader-effects-particles","provider":"webgpu","motionModel":"stateful","supportsPngSnapshot":true,"supportsEditableSeek":false,"loop":{"kind":"continuous","periodMs":null}},"nativeControls":{"surface":{"type":"select","label":"Surface","group":"Framing","default":"canvas","options":[{"label":"Full canvas","value":"canvas"},{"label":"Shape","value":"shape"}]},"origin":{"default":"center","type":"origin","label":"Origin","group":"Position"},"center":{"default":{"x":0.5,"y":0.5},"type":"position","label":"Center","group":"Position","units":["%","px"]},"scale":{"default":1,"type":"range","min":0.1,"max":3,"step":0.01,"label":"Scale","group":"Position"},"rotation":{"default":0,"type":"range","min":0,"max":360,"step":1,"label":"Rotation","group":"Position"},"colorA":{"default":"#8ec5ff","type":"color","label":"Rest Color","group":"Colors","palette":"main"},"colorB":{"default":"#ff7ad9","type":"color","label":"Excited Color","group":"Colors","palette":"highlight"},"count":{"default":4000,"type":"range","min":1000,"max":16000,"step":1000,"label":"Count","group":"Particles"},"size":{"default":1.5,"type":"range","min":0.6,"max":6,"step":0.1,"label":"Size","group":"Particles"},"particleShape":{"default":"dot","type":"select","options":[{"label":"Dot","value":"dot"},{"label":"Square","value":"square"},{"label":"Glow","value":"glow"}],"label":"Shape","group":"Particles"},"spread":{"default":1,"type":"range","min":0.1,"max":3,"step":0.01,"label":"Spread","group":"Physics"},"agitation":{"default":0.12,"type":"range","min":0,"max":1,"step":0.01,"label":"Agitation","group":"Physics"},"damping":{"default":0.4,"type":"range","min":0,"max":1,"step":0.01,"label":"Damping","group":"Physics"},"gravity":{"default":0,"type":"range","min":-2,"max":2,"step":0.01,"label":"Gravity","group":"Physics"},"mouseInfluence":{"default":2,"type":"range","min":-5,"max":5,"step":0.01,"label":"Cursor Force","group":"Interaction"},"mouseRadius":{"default":0.2,"type":"range","min":0.05,"max":0.8,"step":0.01,"label":"Cursor Radius","group":"Interaction"},"exposure":{"default":1,"type":"range","min":0.2,"max":3,"step":0.01,"label":"Exposure","group":"Particles"},"softness":{"default":0.1,"type":"range","min":0,"max":1,"step":0.01,"label":"Softness","group":"Particles"},"depth":{"default":0.18,"type":"range","min":0.02,"max":0.6,"step":0.01,"label":"Depth","group":"Particles"},"colorSpace":{"default":"oklab","type":"select","options":[{"label":"Linear RGB","value":"linear"},{"label":"OKLCh","value":"oklch"},{"label":"OKLAB","value":"oklab"},{"label":"HSL","value":"hsl"},{"label":"HSV","value":"hsv"},{"label":"LCH","value":"lch"}],"label":"Color Space","group":"Colors"},"shape":{"default":"{\"type\":\"sphere3D\",\"radius\":0.35}","type":"shape","label":"Shape","group":"Shape"},"shapeSdfUrl":{"default":""},"shapeType":{"default":""}},"settingsKey":"effectProps","requiresWebGPU":true},{"id":"shader-effects-floating-particles","name":"Floating Particles","description":"Drifting, twinkling motes — thousands of real simulated particles floating in a shared heading with per-particle wander and variance, and a cursor that stirs the field with a gust that settles back into the drift · Textures","engine":"Shaders.com WebGPU","qualityScore":78.8,"sourceLabel":"Shaders.com · MIT","sourceUrl":"https://github.com/shader-effects-inc/shaders","category":"light","kind":"backgrounds","motion":{"materialId":"shader-effects-floating-particles","provider":"webgpu","motionModel":"procedural","supportsPngSnapshot":true,"supportsEditableSeek":true,"loop":{"kind":"continuous","periodMs":null}},"nativeControls":{"particleColor":{"default":"#ffffff","type":"color","label":"Particle Color","group":"Colors","palette":"main"},"shape":{"default":"dot","type":"select","options":[{"label":"Dot","value":"dot"},{"label":"Square","value":"square"},{"label":"Glow","value":"glow"}],"label":"Shape","group":"Effect"},"count":{"default":1200,"type":"range","min":100,"max":8192,"step":100,"label":"Count","group":"Effect"},"particleSize":{"default":1.2,"type":["range","map"],"min":0.3,"max":4,"step":0.05,"label":"Particle Size","group":"Effect"},"softness":{"default":0.1,"type":["range","map"],"min":0,"max":1,"step":0.01,"label":"Softness","group":"Effect"},"speed":{"default":0.25,"type":"range","min":0,"max":1,"step":0.01,"label":"Speed","group":"Animation","hidden":true},"angle":{"default":90,"type":"range","min":0,"max":360,"step":1,"label":"Angle","group":"Animation"},"speedVariance":{"default":0.3,"type":"range","min":0,"max":1,"step":0.05,"label":"Speed Variance","group":"Animation"},"angleVariance":{"default":30,"type":"range","min":0,"max":180,"step":1,"label":"Angle Variance","group":"Animation"},"randomness":{"default":0.25,"type":["range","map"],"min":0,"max":1,"step":0.05,"label":"Randomness","group":"Animation"},"twinkle":{"default":0.5,"type":["range","map"],"min":0,"max":1,"step":0.05,"label":"Twinkle","group":"Animation"},"cursorStrength":{"default":0,"type":"range","min":0,"max":1,"step":0.01,"label":"Cursor Gust","group":"Interaction"}},"settingsKey":"effectProps","requiresWebGPU":true},{"id":"shader-effects-falling-lines","name":"Falling Lines","description":"Directional falling lines with a leading-to-trailing color fade · Textures","engine":"Shaders.com WebGPU","qualityScore":78.7,"sourceLabel":"Shaders.com · MIT","sourceUrl":"https://github.com/shader-effects-inc/shaders","category":"light","kind":"backgrounds","motion":{"materialId":"shader-effects-falling-lines","provider":"webgpu","motionModel":"procedural","supportsPngSnapshot":true,"supportsEditableSeek":true,"loop":{"kind":"continuous","periodMs":null}},"nativeControls":{"colorA":{"default":"#ffffff","type":"color","label":"Lead Color","group":"Colors","palette":"main"},"colorB":{"default":"#ffffff00","type":"color","label":"Trail Color","group":"Colors","palette":"main"},"colorSpace":{"default":"linear","type":"select","options":[{"label":"Linear RGB","value":"linear"},{"label":"OKLCh","value":"oklch"},{"label":"OKLAB","value":"oklab"},{"label":"HSL","value":"hsl"},{"label":"HSV","value":"hsv"},{"label":"LCH","value":"lch"}],"label":"Color Space","group":"Colors"},"angle":{"default":90,"type":"range","min":0,"max":360,"step":1,"label":"Angle","group":"Effect"},"speed":{"default":0.5,"type":"range","min":0,"max":3,"step":0.01,"label":"Speed","group":"Animation","hidden":true},"speedVariance":{"default":0.3,"type":"range","min":0,"max":1,"step":0.01,"label":"Speed Variance","group":"Animation"},"density":{"default":15,"type":"range","min":1,"max":60,"step":1,"label":"Density","group":"Effect"},"trailLength":{"default":0.35,"type":["range","map"],"min":0.01,"max":1,"step":0.01,"label":"Trail Length","group":"Effect"},"balance":{"default":0.5,"type":["range","map"],"min":0,"max":1,"step":0.01,"label":"Balance","group":"Colors"},"strokeWidth":{"default":0.15,"type":["range","map"],"min":0.02,"max":1,"step":0.02,"label":"Stroke Width","group":"Effect"},"rounding":{"default":1,"type":["range","map"],"min":0,"max":1,"step":0.01,"label":"Rounding","group":"Effect"}},"settingsKey":"effectProps","requiresWebGPU":true},{"id":"shader-effects-fractal-noise","name":"Fractal Noise","description":"Multi-octave fractal Brownian motion noise texture with true noise evolution · Textures","engine":"Shaders.com WebGPU","qualityScore":78.6,"sourceLabel":"Shaders.com · MIT","sourceUrl":"https://github.com/shader-effects-inc/shaders","category":"gradient","kind":"backgrounds","motion":{"materialId":"shader-effects-fractal-noise","provider":"webgpu","motionModel":"procedural","supportsPngSnapshot":true,"supportsEditableSeek":true,"loop":{"kind":"continuous","periodMs":null}},"nativeControls":{"colorA":{"default":"#000000","type":"color","label":"Color A","group":"Colors","palette":"base"},"colorB":{"default":"#ffffff","type":"color","label":"Color B","group":"Colors","palette":"main"},"stops":{"default":null,"type":"gradient-stops","label":"Colors","group":"Colors"},"octaves":{"default":4,"type":"range","min":1,"max":8,"step":1,"label":"Octaves","group":"Effect"},"detail":{"default":2,"type":["range","map"],"min":1,"max":4,"step":0.1,"label":"Detail","group":"Effect"},"contrast":{"default":0.5,"type":["range","map"],"min":0.1,"max":1,"step":0.01,"label":"Contrast","group":"Effect"},"speed":{"default":0.15,"type":"range","min":0,"max":1,"step":0.01,"label":"Speed","group":"Animation","hidden":true},"angle":{"default":0,"type":["range","map"],"min":-180,"max":180,"step":1,"label":"Angle","group":"Effect"},"seed":{"default":0,"type":["range","map"],"min":0,"max":100,"step":1,"label":"Seed","group":"Effect"},"colorSpace":{"default":"linear","type":"select","options":[{"label":"Linear RGB","value":"linear"},{"label":"OKLCh","value":"oklch"},{"label":"OKLAB","value":"oklab"},{"label":"HSL","value":"hsl"},{"label":"HSV","value":"hsv"},{"label":"LCH","value":"lch"}],"label":"Color Space","group":"Colors"}},"settingsKey":"effectProps","requiresWebGPU":true},{"id":"shader-effects-erosion-noise","name":"Erosion Noise","description":"Branching, hydraulic-erosion ridges carved into noise · Textures","engine":"Shaders.com WebGPU","qualityScore":78.5,"sourceLabel":"Shaders.com · MIT","sourceUrl":"https://github.com/shader-effects-inc/shaders","category":"gradient","kind":"backgrounds","motion":{"materialId":"shader-effects-erosion-noise","provider":"webgpu","motionModel":"procedural","supportsPngSnapshot":true,"supportsEditableSeek":true,"loop":{"kind":"continuous","periodMs":null}},"nativeControls":{"colorA":{"default":"#ffffff","type":"color","label":"Color A","group":"Colors","palette":"base"},"colorB":{"default":"#000000","type":"color","label":"Color B","group":"Colors","palette":"main"},"stops":{"default":null,"type":"gradient-stops","label":"Colors","group":"Colors"},"colorSpace":{"default":"linear","type":"select","options":[{"label":"Linear RGB","value":"linear"},{"label":"OKLCh","value":"oklch"},{"label":"OKLAB","value":"oklab"},{"label":"HSL","value":"hsl"},{"label":"HSV","value":"hsv"},{"label":"LCH","value":"lch"}],"label":"Color Space","group":"Colors"},"scale":{"default":1.5,"type":"range","min":-2,"max":5,"step":0.1,"label":"Scale","group":"Effect"},"contrast":{"default":0,"type":["range","map"],"min":-1,"max":5,"step":0.1,"label":"Contrast","group":"Effect"},"balance":{"default":0,"type":["range","map"],"min":-1,"max":1,"step":0.05,"label":"Balance","group":"Effect"},"seed":{"default":0,"type":"range","min":0,"max":100,"step":1,"label":"Seed","group":"Effect"}},"settingsKey":"effectProps","requiresWebGPU":true},{"id":"shader-effects-beam","name":"Beam","description":"A beam of light from one point to another. · Textures","engine":"Shaders.com WebGPU","qualityScore":78,"sourceLabel":"Shaders.com · MIT","sourceUrl":"https://github.com/shader-effects-inc/shaders","category":"light","kind":"backgrounds","motion":{"materialId":"shader-effects-beam","provider":"webgpu","motionModel":"procedural","supportsPngSnapshot":true,"supportsEditableSeek":true,"loop":{"kind":"continuous","periodMs":null}},"nativeControls":{"startPosition":{"default":{"x":0.2,"y":0.5},"type":"position","label":"Start Position","group":"Position"},"endPosition":{"default":{"x":0.8,"y":0.5},"type":"position","label":"End Position","group":"Position"},"startThickness":{"default":0.2,"type":["range","map"],"min":0,"max":2,"step":0.1,"label":"Start Thickness","group":"Effect"},"endThickness":{"default":0.2,"type":["range","map"],"min":0,"max":2,"step":0.1,"label":"End Thickness","group":"Effect"},"startSoftness":{"default":0.5,"type":["range","map"],"min":0,"max":50,"step":0.1,"label":"Start Softness","group":"Effect"},"endSoftness":{"default":0.5,"type":["range","map"],"min":0,"max":20,"step":0.1,"label":"End Softness","group":"Effect"},"insideColor":{"default":"#FF0000","type":"color","label":"Inside Color","group":"Colors","palette":"highlight"},"outsideColor":{"default":"#0000FF","type":"color","label":"Outside Color","group":"Colors","palette":"main"},"colorSpace":{"default":"linear","type":"select","options":[{"label":"Linear RGB","value":"linear"},{"label":"OKLCh","value":"oklch"},{"label":"OKLAB","value":"oklab"},{"label":"HSL","value":"hsl"},{"label":"HSV","value":"hsv"},{"label":"LCH","value":"lch"}],"label":"Color Space","group":"Colors"}},"settingsKey":"effectProps","requiresWebGPU":true},{"description":"Animated Voronoi cells with controllable glow, gaps, and distortion. Paper’s Default preset.","engine":"Paper Shaders","id":"paper-voronoi","name":"Voronoi","qualityScore":76.8,"sourceLabel":"Paper · Apache-2.0","sourceUrl":"https://github.com/paper-design/shaders","category":"graphic","kind":"backgrounds","motion":{"materialId":"paper-voronoi","provider":"paper","motionModel":"procedural","supportsPngSnapshot":true,"supportsEditableSeek":true,"loop":{"kind":"continuous","periodMs":null}}},{"description":"A tapered procedural spiral with controllable noise and softness. Paper’s Default preset.","engine":"Paper Shaders","id":"paper-spiral","name":"Spiral","qualityScore":74.8,"sourceLabel":"Paper · Apache-2.0","sourceUrl":"https://github.com/paper-design/shaders","category":"graphic","kind":"backgrounds","motion":{"materialId":"paper-spiral","provider":"paper","motionModel":"procedural","supportsPngSnapshot":true,"supportsEditableSeek":true,"loop":{"kind":"continuous","periodMs":null}}},{"description":"Animated Voronoi cells with controllable glow, gaps, and distortion. Paper’s Bubbles preset.","engine":"Paper Shaders","id":"paper-voronoi-bubbles","name":"Voronoi · Bubbles","qualityScore":76,"sourceLabel":"Paper · Apache-2.0","sourceUrl":"https://github.com/paper-design/shaders","category":"graphic","kind":"backgrounds","motion":{"materialId":"paper-voronoi-bubbles","provider":"paper","motionModel":"procedural","supportsPngSnapshot":true,"supportsEditableSeek":true,"loop":{"kind":"continuous","periodMs":null}}},{"description":"A tapered procedural spiral with controllable noise and softness. Paper’s Droplet preset.","engine":"Paper Shaders","id":"paper-spiral-droplet","name":"Spiral · Droplet","qualityScore":74,"sourceLabel":"Paper · Apache-2.0","sourceUrl":"https://github.com/paper-design/shaders","category":"graphic","kind":"backgrounds","motion":{"materialId":"paper-spiral-droplet","provider":"paper","motionModel":"procedural","supportsPngSnapshot":true,"supportsEditableSeek":true,"loop":{"kind":"continuous","periodMs":null}}},{"description":"Animated Voronoi cells with controllable glow, gaps, and distortion. Paper’s Cells preset.","engine":"Paper Shaders","id":"paper-voronoi-cells","name":"Voronoi · Cells","qualityScore":76,"sourceLabel":"Paper · Apache-2.0","sourceUrl":"https://github.com/paper-design/shaders","category":"graphic","kind":"backgrounds","motion":{"materialId":"paper-voronoi-cells","provider":"paper","motionModel":"procedural","supportsPngSnapshot":true,"supportsEditableSeek":true,"loop":{"kind":"continuous","periodMs":null}}},{"description":"A tapered procedural spiral with controllable noise and softness. Paper’s Jungle preset.","engine":"Paper Shaders","id":"paper-spiral-jungle","name":"Spiral · Jungle","qualityScore":74,"sourceLabel":"Paper · Apache-2.0","sourceUrl":"https://github.com/paper-design/shaders","category":"graphic","kind":"backgrounds","motion":{"materialId":"paper-spiral-jungle","provider":"paper","motionModel":"procedural","supportsPngSnapshot":true,"supportsEditableSeek":true,"loop":{"kind":"continuous","periodMs":null}}},{"description":"Animated Voronoi cells with controllable glow, gaps, and distortion. Paper’s Lights preset.","engine":"Paper Shaders","id":"paper-voronoi-lights","name":"Voronoi · Lights","qualityScore":76,"sourceLabel":"Paper · Apache-2.0","sourceUrl":"https://github.com/paper-design/shaders","category":"graphic","kind":"backgrounds","motion":{"materialId":"paper-voronoi-lights","provider":"paper","motionModel":"procedural","supportsPngSnapshot":true,"supportsEditableSeek":true,"loop":{"kind":"continuous","periodMs":null}}},{"description":"A tapered procedural spiral with controllable noise and softness. Paper’s Swirl preset.","engine":"Paper Shaders","id":"paper-spiral-swirl","name":"Spiral · Swirl","qualityScore":74,"sourceLabel":"Paper · Apache-2.0","sourceUrl":"https://github.com/paper-design/shaders","category":"fluid","kind":"backgrounds","motion":{"materialId":"paper-spiral-swirl","provider":"paper","motionModel":"procedural","supportsPngSnapshot":true,"supportsEditableSeek":true,"loop":{"kind":"continuous","periodMs":null}}},{"description":"A luminous animated perimeter with flexible shape and energy falloff. Paper’s Default preset.","engine":"Paper Shaders","id":"paper-pulsing-border","name":"Pulsing Border","qualityScore":72.8,"sourceLabel":"Paper · Apache-2.0","sourceUrl":"https://github.com/paper-design/shaders","category":"light","kind":"backgrounds","motion":{"materialId":"paper-pulsing-border","provider":"paper","motionModel":"procedural","supportsPngSnapshot":true,"supportsEditableSeek":true,"loop":{"kind":"continuous","periodMs":null}}},{"id":"shader-effects-worley-noise","name":"Worley Noise","description":"Cellular noise field — distance-based, with selectable feature combinations and fractal octaves · Textures","engine":"Shaders.com WebGPU","qualityScore":71.8,"sourceLabel":"Shaders.com · MIT","sourceUrl":"https://github.com/shader-effects-inc/shaders","category":"gradient","kind":"backgrounds","motion":{"materialId":"shader-effects-worley-noise","provider":"webgpu","motionModel":"procedural","supportsPngSnapshot":true,"supportsEditableSeek":true,"loop":{"kind":"continuous","periodMs":null}},"nativeControls":{"colorA":{"default":"#ffffff","type":"color","label":"Color A (Low)","group":"Colors","palette":"base"},"colorB":{"default":"#000000","type":"color","label":"Color B (High)","group":"Colors","palette":"main"},"colorSpace":{"default":"linear","type":"select","options":[{"label":"Linear RGB","value":"linear"},{"label":"OKLCh","value":"oklch"},{"label":"OKLAB","value":"oklab"},{"label":"HSL","value":"hsl"},{"label":"HSV","value":"hsv"},{"label":"LCH","value":"lch"}],"label":"Color Space","group":"Colors"},"scale":{"default":6,"type":["range","map"],"min":1,"max":30,"step":0.5,"label":"Scale","group":"Effect"},"mode":{"default":"f1","type":"select","options":[{"label":"F1 (Cells)","value":"f1"},{"label":"F2 (Wider Cells)","value":"f2"},{"label":"F2 − F1 (Edges)","value":"f2MinusF1"},{"label":"F1 + F2","value":"f1PlusF2"},{"label":"F1 × F2","value":"f1TimesF2"}],"label":"Mode","group":"Effect"},"distance":{"default":"euclidean","type":"select","options":[{"label":"Euclidean","value":"euclidean"},{"label":"Manhattan","value":"manhattan"},{"label":"Chebyshev","value":"chebyshev"}],"label":"Distance","group":"Effect"},"octaves":{"default":1,"type":"range","min":1,"max":4,"step":1,"label":"Octaves","group":"Effect"},"lacunarity":{"default":2,"type":["range","map"],"min":1.5,"max":4,"step":0.1,"label":"Lacunarity","group":"Effect","condition":{"octaves":[2,3,4]}},"persistence":{"default":0.5,"type":["range","map"],"min":0,"max":1,"step":0.01,"label":"Persistence","group":"Effect","condition":{"octaves":[2,3,4]}},"jitter":{"default":1,"type":["range","map"],"min":0,"max":1,"step":0.01,"label":"Jitter","group":"Effect"},"contrast":{"default":1,"type":["range","map"],"min":0.25,"max":4,"step":0.01,"label":"Contrast","group":"Effect"},"balance":{"default":0,"type":["range","map"],"min":-1,"max":1,"step":0.01,"label":"Balance","group":"Effect"},"seed":{"default":0,"type":["range","map"],"min":0,"max":100,"step":1,"label":"Seed","group":"Effect"},"speed":{"default":0.5,"type":"range","min":0,"max":5,"step":0.1,"label":"Speed","group":"Animation","hidden":true}},"settingsKey":"effectProps","requiresWebGPU":true},{"description":"A luminous animated perimeter with flexible shape and energy falloff. Paper’s Circle preset.","engine":"Paper Shaders","id":"paper-pulsing-border-circle","name":"Pulsing Border · Circle","qualityScore":72,"sourceLabel":"Paper · Apache-2.0","sourceUrl":"https://github.com/paper-design/shaders","category":"light","kind":"backgrounds","motion":{"materialId":"paper-pulsing-border-circle","provider":"paper","motionModel":"procedural","supportsPngSnapshot":true,"supportsEditableSeek":true,"loop":{"kind":"continuous","periodMs":null}}},{"id":"shader-effects-isometric-cubes","name":"Isometric Cubes","description":"Isometric tumbling-blocks tiling — a 3D cube illusion (rhombille pattern) · Textures","engine":"Shaders.com WebGPU","qualityScore":71.2,"sourceLabel":"Shaders.com · MIT","sourceUrl":"https://github.com/shader-effects-inc/shaders","category":"graphic","kind":"backgrounds","motion":{"materialId":"shader-effects-isometric-cubes","provider":"webgpu","motionModel":"procedural","supportsPngSnapshot":true,"supportsEditableSeek":true,"loop":{"kind":"continuous","periodMs":null}},"nativeControls":{"colorA":{"default":"#7c5cff","type":"color","label":"Color A","group":"Colors","palette":"main"},"colorB":{"default":"#ff5c9d","type":"color","label":"Color B","group":"Colors","palette":"highlight"},"lineColor":{"default":"#000000","type":"color","label":"Edges","group":"Colors","palette":"base"},"cells":{"default":6,"type":["range","map"],"min":1,"max":30,"step":1,"label":"Cells","group":"Effect"},"thickness":{"default":1,"type":["range","map"],"min":0,"max":10,"step":0.1,"label":"Thickness","group":"Effect"},"rotation":{"default":0,"type":["range","map"],"min":0,"max":360,"step":1,"label":"Rotation","group":"Effect"},"softness":{"default":0,"type":["range","map"],"min":0,"max":1,"step":0.01,"label":"Softness","group":"Effect"},"colorVariation":{"default":1,"type":["range","map"],"min":0,"max":1,"step":0.01,"label":"Variation","group":"Colors"},"colorSpace":{"default":"linear","type":"select","options":[{"label":"Linear RGB","value":"linear"},{"label":"OKLCh","value":"oklch"},{"label":"OKLAB","value":"oklab"},{"label":"HSL","value":"hsl"},{"label":"HSV","value":"hsv"},{"label":"LCH","value":"lch"}],"label":"Color Space","group":"Colors"}},"settingsKey":"effectProps","requiresWebGPU":true},{"description":"A luminous animated perimeter with flexible shape and energy falloff. Paper’s Northern lights preset.","engine":"Paper Shaders","id":"paper-pulsing-border-northern-lights","name":"Pulsing Border · Northern lights","qualityScore":72,"sourceLabel":"Paper · Apache-2.0","sourceUrl":"https://github.com/paper-design/shaders","category":"light","kind":"backgrounds","motion":{"materialId":"paper-pulsing-border-northern-lights","provider":"paper","motionModel":"procedural","supportsPngSnapshot":true,"supportsEditableSeek":true,"loop":{"kind":"continuous","periodMs":null}}},{"id":"shader-effects-truchet","name":"Truchet","description":"Quarter-circle arc tiles that connect to form organic, maze-like flowing curves · Textures","engine":"Shaders.com WebGPU","qualityScore":71.1,"sourceLabel":"Shaders.com · MIT","sourceUrl":"https://github.com/shader-effects-inc/shaders","category":"graphic","kind":"backgrounds","motion":{"materialId":"shader-effects-truchet","provider":"webgpu","motionModel":"procedural","supportsPngSnapshot":true,"supportsEditableSeek":true,"loop":{"kind":"continuous","periodMs":null}},"nativeControls":{"colorA":{"default":"#000000","type":"color","label":"Color A","group":"Colors","palette":"base"},"colorB":{"default":"#ffffff","type":"color","label":"Color B","group":"Colors","palette":"main"},"cells":{"default":10,"type":["range","map"],"min":2,"max":40,"step":1,"label":"Cells","group":"Effect"},"thickness":{"default":2,"type":["range","map"],"min":0,"max":20,"step":0.1,"label":"Thickness","group":"Effect"},"rotation":{"default":0,"type":["range","map"],"min":0,"max":360,"step":1,"label":"Rotation","group":"Effect"},"softness":{"default":0,"type":["range","map"],"min":0,"max":1,"step":0.01,"label":"Softness","group":"Effect"},"seed":{"default":0,"type":["range","map"],"min":0,"max":100,"step":1,"label":"Seed","group":"Effect"},"colorSpace":{"default":"linear","type":"select","options":[{"label":"Linear RGB","value":"linear"},{"label":"OKLCh","value":"oklch"},{"label":"OKLAB","value":"oklab"},{"label":"HSL","value":"hsl"},{"label":"HSV","value":"hsv"},{"label":"LCH","value":"lch"}],"label":"Color Space","group":"Colors"}},"settingsKey":"effectProps","requiresWebGPU":true},{"description":"A luminous animated perimeter with flexible shape and energy falloff. Paper’s Solid line preset.","engine":"Paper Shaders","id":"paper-pulsing-border-solid-line","name":"Pulsing Border · Solid line","qualityScore":72,"sourceLabel":"Paper · Apache-2.0","sourceUrl":"https://github.com/paper-design/shaders","category":"light","kind":"backgrounds","motion":{"materialId":"paper-pulsing-border-solid-line","provider":"paper","motionModel":"procedural","supportsPngSnapshot":true,"supportsEditableSeek":true,"loop":{"kind":"continuous","periodMs":null}}},{"id":"shader-effects-weave","name":"Weave","description":"Interlaced textile weave pattern with two thread colors going over and under each other · Textures","engine":"Shaders.com WebGPU","qualityScore":71,"sourceLabel":"Shaders.com · MIT","sourceUrl":"https://github.com/shader-effects-inc/shaders","category":"graphic","kind":"backgrounds","motion":{"materialId":"shader-effects-weave","provider":"webgpu","motionModel":"procedural","supportsPngSnapshot":true,"supportsEditableSeek":true,"loop":{"kind":"continuous","periodMs":null}},"nativeControls":{"colorA":{"default":"#c4c4c4","type":"color","label":"X Color","group":"Colors","palette":"base"},"colorB":{"default":"#4d4d4d","type":"color","label":"Y Color","group":"Colors","palette":"main"},"cells":{"default":10,"type":["range","map"],"min":2,"max":40,"step":1,"label":"Cells","group":"Effect"},"gap":{"default":0.25,"type":["range","map"],"min":0,"max":0.45,"step":0.01,"label":"Gap","group":"Effect"},"rotation":{"default":0,"type":["range","map"],"min":0,"max":360,"step":1,"label":"Rotation","group":"Effect"}},"settingsKey":"effectProps","requiresWebGPU":true},{"id":"shader-effects-spiral","name":"Spiral","description":"Rotating spiral pattern with animated movement · Textures","engine":"Shaders.com WebGPU","qualityScore":70.9,"sourceLabel":"Shaders.com · MIT","sourceUrl":"https://github.com/shader-effects-inc/shaders","category":"graphic","kind":"backgrounds","motion":{"materialId":"shader-effects-spiral","provider":"webgpu","motionModel":"procedural","supportsPngSnapshot":true,"supportsEditableSeek":true,"loop":{"kind":"continuous","periodMs":null}},"nativeControls":{"colorA":{"default":"#000000","type":"color","label":"Color A","group":"Colors","palette":"base"},"colorB":{"default":"#ffffff","type":"color","label":"Color B","group":"Colors","palette":"main"},"strokeWidth":{"default":0.5,"type":["range","map"],"min":0,"max":2,"step":0.1,"label":"Stroke Width","group":"Effect"},"strokeFalloff":{"default":0,"type":["range","map"],"min":0,"max":1,"step":0.1,"label":"Stroke Falloff","group":"Effect"},"softness":{"default":0,"type":["range","map"],"min":0,"max":1,"step":0.1,"label":"Softness","group":"Effect"},"speed":{"default":1,"type":"range","min":-3,"max":3,"step":0.1,"label":"Speed","group":"Animation","hidden":true},"center":{"default":{"x":0.5,"y":0.5},"type":"position","label":"Center","group":"Position"},"scale":{"default":1,"type":["range","map"],"min":0.1,"max":5,"step":0.1,"label":"Scale","group":"Effect"},"colorSpace":{"default":"linear","type":"select","options":[{"label":"Linear RGB","value":"linear"},{"label":"OKLCh","value":"oklch"},{"label":"OKLAB","value":"oklab"},{"label":"HSL","value":"hsl"},{"label":"HSV","value":"hsv"},{"label":"LCH","value":"lch"}],"label":"Color Space","group":"Colors"}},"settingsKey":"effectProps","requiresWebGPU":true},{"id":"shader-effects-scratches","name":"Scratches","description":"Fine hairline scratches, like a worn film or scratched surface · Textures","engine":"Shaders.com WebGPU","qualityScore":70.8,"sourceLabel":"Shaders.com · MIT","sourceUrl":"https://github.com/shader-effects-inc/shaders","category":"graphic","kind":"backgrounds","motion":{"materialId":"shader-effects-scratches","provider":"webgpu","motionModel":"procedural","supportsPngSnapshot":true,"supportsEditableSeek":true,"loop":{"kind":"continuous","periodMs":null}},"nativeControls":{"colorA":{"default":"#ffffff","type":"color","label":"Color A","group":"Colors","palette":"base"},"colorB":{"default":"#000000","type":"color","label":"Color B","group":"Colors","palette":"main"},"scale":{"default":2,"type":"range","min":-2,"max":5,"step":0.1,"label":"Scale","group":"Effect"},"thickness":{"default":1,"type":"range","min":0.2,"max":5,"step":0.01,"label":"Thickness","group":"Effect"},"seed":{"default":0,"type":"range","min":0,"max":100,"step":1,"label":"Seed","group":"Effect"},"speed":{"default":1,"type":"range","min":0,"max":5,"step":0.1,"label":"Speed","group":"Animation","hidden":true}},"settingsKey":"effectProps","requiresWebGPU":true},{"id":"shader-effects-sine-wave","name":"Sine Wave","description":"Animated wave with thickness and softness · Textures","engine":"Shaders.com WebGPU","qualityScore":70.7,"sourceLabel":"Shaders.com · MIT","sourceUrl":"https://github.com/shader-effects-inc/shaders","category":"graphic","kind":"backgrounds","motion":{"materialId":"shader-effects-sine-wave","provider":"webgpu","motionModel":"procedural","supportsPngSnapshot":true,"supportsEditableSeek":true,"loop":{"kind":"continuous","periodMs":null}},"nativeControls":{"color":{"default":"#ffffff","type":"color","label":"Color","group":"Colors","palette":"main"},"amplitude":{"default":0.15,"type":["range","map"],"min":0,"max":1,"step":0.1,"label":"Amplitude","group":"Effect"},"frequency":{"default":1,"type":["range","map"],"min":0.1,"max":20,"step":0.1,"label":"Frequency","group":"Effect"},"speed":{"default":1,"type":"range","min":-5,"max":5,"step":0.1,"label":"Speed","group":"Animation","hidden":true},"angle":{"default":0,"type":["range","map"],"min":0,"max":360,"step":1,"label":"Angle","group":"Effect"},"position":{"default":{"x":0.5,"y":0.5},"type":"position","label":"Position","group":"Position"},"thickness":{"default":0.2,"type":["range","map"],"min":0,"max":2,"step":0.1,"label":"Thickness","group":"Effect"},"softness":{"default":0.4,"type":["range","map"],"min":0,"max":1,"step":0.1,"label":"Softness","group":"Effect"}},"settingsKey":"effectProps","requiresWebGPU":true},{"description":"Orbiting color particles with soft depth and luminous motion. Paper’s Default preset.","engine":"Paper Shaders","id":"paper-dot-orbit","name":"Dot Orbit","qualityScore":68.8,"sourceLabel":"Paper · Apache-2.0","sourceUrl":"https://github.com/paper-design/shaders","category":"gradient","kind":"backgrounds","motion":{"materialId":"paper-dot-orbit","provider":"paper","motionModel":"procedural","supportsPngSnapshot":true,"supportsEditableSeek":true,"loop":{"kind":"continuous","periodMs":null}}},{"description":"Procedural fibers, folds, crumples, and tactile paper grain. Paper’s Default preset.","engine":"Paper Shaders","id":"paper-paper-texture","name":"Paper Texture","qualityScore":62.8,"sourceLabel":"Paper · Apache-2.0","sourceUrl":"https://github.com/paper-design/shaders","category":"graphic","kind":"backgrounds","motion":{"materialId":"paper-paper-texture","provider":"paper","motionModel":"static","supportsPngSnapshot":true,"supportsEditableSeek":false,"loop":{"kind":"static"}}},{"description":"Orbiting color particles with soft depth and luminous motion. Paper’s Bubbles preset.","engine":"Paper Shaders","id":"paper-dot-orbit-bubbles","name":"Dot Orbit · Bubbles","qualityScore":68,"sourceLabel":"Paper · Apache-2.0","sourceUrl":"https://github.com/paper-design/shaders","category":"gradient","kind":"backgrounds","motion":{"materialId":"paper-dot-orbit-bubbles","provider":"paper","motionModel":"procedural","supportsPngSnapshot":true,"supportsEditableSeek":true,"loop":{"kind":"continuous","periodMs":null}}},{"description":"Procedural fibers, folds, crumples, and tactile paper grain. Paper’s Abstract preset.","engine":"Paper Shaders","id":"paper-paper-texture-abstract","name":"Paper Texture · Abstract","qualityScore":62,"sourceLabel":"Paper · Apache-2.0","sourceUrl":"https://github.com/paper-design/shaders","category":"graphic","kind":"backgrounds","motion":{"materialId":"paper-paper-texture-abstract","provider":"paper","motionModel":"static","supportsPngSnapshot":true,"supportsEditableSeek":false,"loop":{"kind":"static"}}},{"description":"Orbiting color particles with soft depth and luminous motion. Paper’s Hallucinatory preset.","engine":"Paper Shaders","id":"paper-dot-orbit-hallucinatory","name":"Dot Orbit · Hallucinatory","qualityScore":68,"sourceLabel":"Paper · Apache-2.0","sourceUrl":"https://github.com/paper-design/shaders","category":"gradient","kind":"backgrounds","motion":{"materialId":"paper-dot-orbit-hallucinatory","provider":"paper","motionModel":"procedural","supportsPngSnapshot":true,"supportsEditableSeek":true,"loop":{"kind":"continuous","periodMs":null}}},{"description":"Procedural fibers, folds, crumples, and tactile paper grain. Paper’s Cardboard preset.","engine":"Paper Shaders","id":"paper-paper-texture-cardboard","name":"Paper Texture · Cardboard","qualityScore":62,"sourceLabel":"Paper · Apache-2.0","sourceUrl":"https://github.com/paper-design/shaders","category":"graphic","kind":"backgrounds","motion":{"materialId":"paper-paper-texture-cardboard","provider":"paper","motionModel":"static","supportsPngSnapshot":true,"supportsEditableSeek":false,"loop":{"kind":"static"}}},{"description":"Orbiting color particles with soft depth and luminous motion. Paper’s Shine preset.","engine":"Paper Shaders","id":"paper-dot-orbit-shine","name":"Dot Orbit · Shine","qualityScore":68,"sourceLabel":"Paper · Apache-2.0","sourceUrl":"https://github.com/paper-design/shaders","category":"gradient","kind":"backgrounds","motion":{"materialId":"paper-dot-orbit-shine","provider":"paper","motionModel":"procedural","supportsPngSnapshot":true,"supportsEditableSeek":true,"loop":{"kind":"continuous","periodMs":null}}},{"description":"Procedural fibers, folds, crumples, and tactile paper grain. Paper’s Details preset.","engine":"Paper Shaders","id":"paper-paper-texture-details","name":"Paper Texture · Details","qualityScore":62,"sourceLabel":"Paper · Apache-2.0","sourceUrl":"https://github.com/paper-design/shaders","category":"graphic","kind":"backgrounds","motion":{"materialId":"paper-paper-texture-details","provider":"paper","motionModel":"static","supportsPngSnapshot":true,"supportsEditableSeek":false,"loop":{"kind":"static"}}},{"id":"shader-effects-color-wheel","name":"Color Wheel","description":"A directional gradient that smoothly cycles through rainbow colors or a custom set of three colors · Textures","engine":"Shaders.com WebGPU","qualityScore":61.9,"sourceLabel":"Shaders.com · MIT","sourceUrl":"https://github.com/shader-effects-inc/shaders","category":"graphic","kind":"backgrounds","motion":{"materialId":"shader-effects-color-wheel","provider":"webgpu","motionModel":"procedural","supportsPngSnapshot":true,"supportsEditableSeek":true,"loop":{"kind":"continuous","periodMs":null}},"nativeControls":{"mode":{"default":"custom","type":"select","options":[{"label":"Rainbow","value":"rainbow"},{"label":"Custom","value":"custom"}],"label":"Mode","group":"Colors"},"colorA":{"default":"#ff0000","type":"color","label":"Color 1","group":"Colors","condition":{"mode":"custom"},"palette":"base"},"colorB":{"default":"#00ff88","type":"color","label":"Color 2","group":"Colors","condition":{"mode":"custom"},"palette":"main"},"colorC":{"default":"#0066ff","type":"color","label":"Color 3","group":"Colors","condition":{"mode":"custom"},"palette":"highlight"},"scale":{"default":1,"type":["range","map"],"min":0.1,"max":10,"step":0.1,"label":"Scale","group":"Effect"},"angle":{"default":0,"type":["range","map"],"min":-180,"max":180,"step":1,"label":"Angle","group":"Effect"},"speed":{"default":0.05,"type":"range","min":-1,"max":1,"step":0.01,"label":"Speed","group":"Animation","hidden":true},"colorSpace":{"default":"oklch","type":"select","options":[{"label":"Linear RGB","value":"linear"},{"label":"OKLCh","value":"oklch"},{"label":"OKLAB","value":"oklab"},{"label":"HSL","value":"hsl"},{"label":"HSV","value":"hsv"},{"label":"LCH","value":"lch"}],"label":"Color Space","group":"Colors","condition":{"mode":"custom"}}},"settingsKey":"effectProps","requiresWebGPU":true},{"id":"shader-effects-triangular-grid","name":"Triangular Grid","description":"Tiling grid of equilateral triangles with optional animated row offsets · Textures","engine":"Shaders.com WebGPU","qualityScore":61.8,"sourceLabel":"Shaders.com · MIT","sourceUrl":"https://github.com/shader-effects-inc/shaders","category":"graphic","kind":"backgrounds","motion":{"materialId":"shader-effects-triangular-grid","provider":"webgpu","motionModel":"procedural","supportsPngSnapshot":true,"supportsEditableSeek":true,"loop":{"kind":"continuous","periodMs":null}},"nativeControls":{"colorA":{"default":"#1a1a1a","type":"color","label":"Fill","group":"Colors","palette":"base"},"colorB":{"default":"#ffffff","type":"color","label":"Lines","group":"Colors","palette":"main"},"cells":{"default":8,"type":["range","map"],"min":1,"max":40,"step":1,"label":"Cells","group":"Effect"},"thickness":{"default":1,"type":["range","map"],"min":0,"max":10,"step":0.1,"label":"Thickness","group":"Effect"},"rotation":{"default":0,"type":["range","map"],"min":0,"max":360,"step":1,"label":"Rotation","group":"Effect"},"softness":{"default":0,"type":["range","map"],"min":0,"max":1,"step":0.01,"label":"Softness","group":"Effect"},"variation":{"default":0,"type":["range","map"],"min":0,"max":1,"step":0.01,"label":"Variation","group":"Effect"},"speed":{"default":0.5,"type":"range","min":-3,"max":3,"step":0.01,"label":"Speed","group":"Animation","hidden":true},"speedVariance":{"default":0.3,"type":"range","min":0,"max":1,"step":0.01,"label":"Speed Variance","group":"Animation"},"colorSpace":{"default":"linear","type":"select","options":[{"label":"Linear RGB","value":"linear"},{"label":"OKLCh","value":"oklch"},{"label":"OKLAB","value":"oklab"},{"label":"HSL","value":"hsl"},{"label":"HSV","value":"hsv"},{"label":"LCH","value":"lch"}],"label":"Color Space","group":"Colors"}},"settingsKey":"effectProps","requiresWebGPU":true},{"id":"shader-effects-hex-grid","name":"Hex Grid","description":"Honeycomb hexagonal grid pattern · Textures","engine":"Shaders.com WebGPU","qualityScore":61.7,"sourceLabel":"Shaders.com · MIT","sourceUrl":"https://github.com/shader-effects-inc/shaders","category":"graphic","kind":"backgrounds","motion":{"materialId":"shader-effects-hex-grid","provider":"webgpu","motionModel":"procedural","supportsPngSnapshot":true,"supportsEditableSeek":true,"loop":{"kind":"continuous","periodMs":null}},"nativeControls":{"colorA":{"default":"#000000","type":"color","label":"Color A","group":"Colors","palette":"base"},"colorB":{"default":"#ffffff","type":"color","label":"Color B","group":"Colors","palette":"main"},"cells":{"default":8,"type":["range","map"],"min":1,"max":40,"step":1,"label":"Cells","group":"Effect"},"thickness":{"default":1,"type":["range","map"],"min":0,"max":10,"step":0.1,"label":"Thickness","group":"Effect"},"rotation":{"default":0,"type":["range","map"],"min":0,"max":360,"step":1,"label":"Rotation","group":"Effect"},"softness":{"default":0,"type":["range","map"],"min":0,"max":1,"step":0.01,"label":"Softness","group":"Effect"},"variation":{"default":0,"type":["range","map"],"min":0,"max":1,"step":0.01,"label":"Variation","group":"Effect"},"colorSpace":{"default":"linear","type":"select","options":[{"label":"Linear RGB","value":"linear"},{"label":"OKLCh","value":"oklch"},{"label":"OKLAB","value":"oklab"},{"label":"HSL","value":"hsl"},{"label":"HSV","value":"hsv"},{"label":"LCH","value":"lch"}],"label":"Color Space","group":"Colors"}},"settingsKey":"effectProps","requiresWebGPU":true},{"id":"shader-effects-dot-grid","name":"Dot Grid","description":"Grid of dots with optional twinkling animation · Textures","engine":"Shaders.com WebGPU","qualityScore":61.6,"sourceLabel":"Shaders.com · MIT","sourceUrl":"https://github.com/shader-effects-inc/shaders","category":"graphic","kind":"backgrounds","motion":{"materialId":"shader-effects-dot-grid","provider":"webgpu","motionModel":"procedural","supportsPngSnapshot":true,"supportsEditableSeek":true,"loop":{"kind":"continuous","periodMs":null}},"nativeControls":{"color":{"default":"#ffffff","type":"color","label":"Color","group":"Colors","palette":"main"},"density":{"default":30,"type":"range","min":1,"max":200,"step":1,"label":"Density","group":"Effect"},"dotSize":{"default":0.3,"type":["range","map"],"min":0,"max":1,"step":0.01,"label":"Dot Size","group":"Effect"},"offset":{"default":0,"type":["range","map"],"min":0,"max":1,"step":0.01,"label":"Row Offset","group":"Effect"},"speed":{"default":0.5,"type":"range","min":-3,"max":3,"step":0.01,"label":"Speed","group":"Animation","hidden":true},"speedVariance":{"default":0.3,"type":"range","min":0,"max":1,"step":0.01,"label":"Speed Variance","group":"Animation"},"twinkle":{"default":0,"type":["range","map"],"min":0,"max":1,"step":0.1,"label":"Twinkle","group":"Animation"}},"settingsKey":"effectProps","requiresWebGPU":true},{"id":"shader-effects-brick-pattern","name":"Brick Pattern","description":"Classic brick wall pattern with alternating rows and mortar gaps · Textures","engine":"Shaders.com WebGPU","qualityScore":61.5,"sourceLabel":"Shaders.com · MIT","sourceUrl":"https://github.com/shader-effects-inc/shaders","category":"graphic","kind":"backgrounds","motion":{"materialId":"shader-effects-brick-pattern","provider":"webgpu","motionModel":"procedural","supportsPngSnapshot":true,"supportsEditableSeek":true,"loop":{"kind":"continuous","periodMs":null}},"nativeControls":{"colorBrick":{"default":"#000000","type":"color","label":"Brick Color","group":"Colors","palette":"main"},"colorMortar":{"default":"#ffffff","type":"color","label":"Mortar Color","group":"Colors","palette":"base"},"cellsX":{"default":8,"type":["range","map"],"min":1,"max":30,"step":1,"label":"Bricks per Row","group":"Effect"},"cellsY":{"default":10,"type":["range","map"],"min":1,"max":30,"step":1,"label":"Rows","group":"Effect"},"mortar":{"default":0.05,"type":["range","map"],"min":0,"max":1,"step":0.01,"label":"Mortar Gap","group":"Effect"},"softness":{"default":0,"type":["range","map"],"min":0,"max":1,"step":0.01,"label":"Softness","group":"Effect"},"variation":{"default":0,"type":["range","map"],"min":0,"max":1,"step":0.01,"label":"Variation","group":"Effect"},"rotation":{"default":0,"type":["range","map"],"min":0,"max":360,"step":1,"label":"Rotation","group":"Effect"},"speed":{"default":0.5,"type":"range","min":-2,"max":2,"step":0.1,"label":"Speed","group":"Animation","hidden":true},"offset":{"default":0,"type":["range","map"],"min":0,"max":1,"step":0.01,"label":"Offset","group":"Animation"},"speedVariance":{"default":0,"type":["range","map"],"min":0,"max":1,"step":0.01,"label":"Speed Variance","group":"Animation"},"seed":{"default":0,"type":"range","min":0,"max":100,"step":1,"label":"Seed","group":"Animation"},"colorSpace":{"default":"linear","type":"select","options":[{"label":"Linear RGB","value":"linear"},{"label":"OKLCh","value":"oklch"},{"label":"OKLAB","value":"oklab"},{"label":"HSL","value":"hsl"},{"label":"HSV","value":"hsv"},{"label":"LCH","value":"lch"}],"label":"Color Space","group":"Colors"}},"settingsKey":"effectProps","requiresWebGPU":true},{"id":"shader-effects-chevron","name":"Chevron","description":"Animated chevron / zigzag stripe pattern · Textures","engine":"Shaders.com WebGPU","qualityScore":61.4,"sourceLabel":"Shaders.com · MIT","sourceUrl":"https://github.com/shader-effects-inc/shaders","category":"graphic","kind":"backgrounds","motion":{"materialId":"shader-effects-chevron","provider":"webgpu","motionModel":"procedural","supportsPngSnapshot":true,"supportsEditableSeek":true,"loop":{"kind":"continuous","periodMs":null}},"nativeControls":{"colorA":{"default":"#000000","type":"color","label":"Color A","group":"Colors","palette":"base"},"colorB":{"default":"#ffffff","type":"color","label":"Color B","group":"Colors","palette":"main"},"count":{"default":5,"type":["range","map"],"min":1,"max":30,"step":1,"label":"Count","group":"Effect"},"angle":{"default":0,"type":["range","map"],"min":-180,"max":180,"step":1,"label":"Angle","group":"Effect"},"balance":{"default":0.5,"type":["range","map"],"min":0,"max":1,"step":0.01,"label":"Balance","group":"Effect"},"softness":{"default":0,"type":["range","map"],"min":0,"max":1,"step":0.01,"label":"Softness","group":"Effect"},"speed":{"default":0.5,"type":"range","min":-2,"max":2,"step":0.1,"label":"Speed","group":"Animation","hidden":true},"offset":{"default":0,"type":["range","map"],"min":0,"max":1,"step":0.01,"label":"Offset","group":"Animation"},"colorSpace":{"default":"linear","type":"select","options":[{"label":"Linear RGB","value":"linear"},{"label":"OKLCh","value":"oklch"},{"label":"OKLAB","value":"oklab"},{"label":"HSL","value":"hsl"},{"label":"HSV","value":"hsv"},{"label":"LCH","value":"lch"}],"label":"Color Space","group":"Colors"}},"settingsKey":"effectProps","requiresWebGPU":true},{"id":"shader-effects-stripes","name":"Stripes","description":"Alternating colored stripes with animation · Textures","engine":"Shaders.com WebGPU","qualityScore":61.3,"sourceLabel":"Shaders.com · MIT","sourceUrl":"https://github.com/shader-effects-inc/shaders","category":"graphic","kind":"backgrounds","motion":{"materialId":"shader-effects-stripes","provider":"webgpu","motionModel":"procedural","supportsPngSnapshot":true,"supportsEditableSeek":true,"loop":{"kind":"continuous","periodMs":null}},"nativeControls":{"colorA":{"default":"#000000","type":"color","label":"Color A","group":"Colors","palette":"base"},"colorB":{"default":"#ffffff","type":"color","label":"Color B","group":"Colors","palette":"main"},"angle":{"default":45,"type":["range","map"],"min":-180,"max":180,"step":1,"label":"Angle","group":"Effect"},"density":{"default":5,"type":["range","map"],"min":1,"max":30,"step":1,"label":"Density","group":"Effect"},"balance":{"default":0.5,"type":["range","map"],"min":0,"max":1,"step":0.1,"label":"Balance","group":"Effect"},"softness":{"default":0,"type":["range","map"],"min":0,"max":1,"step":0.1,"label":"Softness","group":"Effect"},"speed":{"default":0.2,"type":"range","min":-1,"max":1,"step":0.1,"label":"Speed","group":"Animation","hidden":true},"offset":{"default":0,"type":["range","map"],"min":0,"max":1,"step":0.1,"label":"Offset","group":"Animation"},"colorSpace":{"default":"linear","type":"select","options":[{"label":"Linear RGB","value":"linear"},{"label":"OKLCh","value":"oklch"},{"label":"OKLAB","value":"oklab"},{"label":"HSL","value":"hsl"},{"label":"HSV","value":"hsv"},{"label":"LCH","value":"lch"}],"label":"Color Space","group":"Colors"}},"settingsKey":"effectProps","requiresWebGPU":true},{"id":"shader-effects-block-noise","name":"Block Noise","description":"Blocky value noise with soft cells that morph over time · Textures","engine":"Shaders.com WebGPU","qualityScore":61.2,"sourceLabel":"Shaders.com · MIT","sourceUrl":"https://github.com/shader-effects-inc/shaders","category":"graphic","kind":"backgrounds","motion":{"materialId":"shader-effects-block-noise","provider":"webgpu","motionModel":"procedural","supportsPngSnapshot":true,"supportsEditableSeek":true,"loop":{"kind":"continuous","periodMs":null}},"nativeControls":{"colorA":{"default":"#ffffff","type":"color","label":"Color A","group":"Colors","palette":"base"},"colorB":{"default":"#000000","type":"color","label":"Color B","group":"Colors","palette":"main"},"stops":{"default":null,"type":"gradient-stops","label":"Colors","group":"Colors"},"colorSpace":{"default":"linear","type":"select","options":[{"label":"Linear RGB","value":"linear"},{"label":"OKLCh","value":"oklch"},{"label":"OKLAB","value":"oklab"},{"label":"HSL","value":"hsl"},{"label":"HSV","value":"hsv"},{"label":"LCH","value":"lch"}],"label":"Color Space","group":"Colors"},"scale":{"default":2,"type":"range","min":-2,"max":5,"step":0.1,"label":"Scale","group":"Effect"},"contrast":{"default":0,"type":["range","map"],"min":-1,"max":5,"step":0.1,"label":"Contrast","group":"Effect"},"balance":{"default":0,"type":["range","map"],"min":-1,"max":1,"step":0.05,"label":"Balance","group":"Effect"},"seed":{"default":0,"type":"range","min":0,"max":100,"step":1,"label":"Seed","group":"Effect"},"speed":{"default":1,"type":"range","min":0,"max":5,"step":0.1,"label":"Speed","group":"Animation","hidden":true}},"settingsKey":"effectProps","requiresWebGPU":true},{"id":"shader-effects-blue-noise","name":"Blue Noise","description":"High-frequency blue noise — even, grainy speckle ideal for dithering · Textures","engine":"Shaders.com WebGPU","qualityScore":61.1,"sourceLabel":"Shaders.com · MIT","sourceUrl":"https://github.com/shader-effects-inc/shaders","category":"graphic","kind":"backgrounds","motion":{"materialId":"shader-effects-blue-noise","provider":"webgpu","motionModel":"procedural","supportsPngSnapshot":true,"supportsEditableSeek":true,"loop":{"kind":"continuous","periodMs":null}},"nativeControls":{"colorA":{"default":"#ffffff","type":"color","label":"Color A","group":"Colors","palette":"base"},"colorB":{"default":"#000000","type":"color","label":"Color B","group":"Colors","palette":"main"},"stops":{"default":null,"type":"gradient-stops","label":"Colors","group":"Colors"},"colorSpace":{"default":"linear","type":"select","options":[{"label":"Linear RGB","value":"linear"},{"label":"OKLCh","value":"oklch"},{"label":"OKLAB","value":"oklab"},{"label":"HSL","value":"hsl"},{"label":"HSV","value":"hsv"},{"label":"LCH","value":"lch"}],"label":"Color Space","group":"Colors"},"grain":{"default":1,"type":"range","min":1,"max":32,"step":1,"label":"Grain Size","group":"Effect"},"contrast":{"default":0,"type":["range","map"],"min":-1,"max":5,"step":0.1,"label":"Contrast","group":"Effect"},"balance":{"default":0,"type":["range","map"],"min":-1,"max":1,"step":0.05,"label":"Balance","group":"Effect"},"seed":{"default":0,"type":"range","min":0,"max":100,"step":1,"label":"Seed","group":"Effect"}},"settingsKey":"effectProps","requiresWebGPU":true},{"description":"A graphic dot lattice animated through geometric fields. Paper’s Default preset.","engine":"Paper Shaders","id":"paper-dot-grid","name":"Dot Grid","qualityScore":60.8,"sourceLabel":"Paper · Apache-2.0","sourceUrl":"https://github.com/paper-design/shaders","category":"graphic","kind":"backgrounds","motion":{"materialId":"paper-dot-grid","provider":"paper","motionModel":"static","supportsPngSnapshot":true,"supportsEditableSeek":false,"loop":{"kind":"static"}}},{"description":"Image-aware ordered dithering with graphic color separation. Paper’s Default preset.","engine":"Paper Shaders","id":"paper-image-dithering","name":"Image Dithering","qualityScore":58.8,"sourceLabel":"Paper · Apache-2.0","sourceUrl":"https://github.com/paper-design/shaders","category":"light","kind":"backgrounds","motion":{"materialId":"paper-image-dithering","provider":"paper","motionModel":"static","supportsPngSnapshot":true,"supportsEditableSeek":false,"loop":{"kind":"static"}}},{"description":"A graphic dot lattice animated through geometric fields. Paper’s Tree line preset.","engine":"Paper Shaders","id":"paper-dot-grid-tree-line","name":"Dot Grid · Tree line","qualityScore":60,"sourceLabel":"Paper · Apache-2.0","sourceUrl":"https://github.com/paper-design/shaders","category":"light","kind":"backgrounds","motion":{"materialId":"paper-dot-grid-tree-line","provider":"paper","motionModel":"static","supportsPngSnapshot":true,"supportsEditableSeek":false,"loop":{"kind":"static"}}},{"description":"Image-aware ordered dithering with graphic color separation. Paper’s Natural preset.","engine":"Paper Shaders","id":"paper-image-dithering-natural","name":"Image Dithering · Natural","qualityScore":58,"sourceLabel":"Paper · Apache-2.0","sourceUrl":"https://github.com/paper-design/shaders","category":"light","kind":"backgrounds","motion":{"materialId":"paper-image-dithering-natural","provider":"paper","motionModel":"static","supportsPngSnapshot":true,"supportsEditableSeek":false,"loop":{"kind":"static"}}},{"description":"A graphic dot lattice animated through geometric fields. Paper’s Triangles preset.","engine":"Paper Shaders","id":"paper-dot-grid-triangles","name":"Dot Grid · Triangles","qualityScore":60,"sourceLabel":"Paper · Apache-2.0","sourceUrl":"https://github.com/paper-design/shaders","category":"graphic","kind":"backgrounds","motion":{"materialId":"paper-dot-grid-triangles","provider":"paper","motionModel":"static","supportsPngSnapshot":true,"supportsEditableSeek":false,"loop":{"kind":"static"}}},{"description":"Image-aware ordered dithering with graphic color separation. Paper’s Noise preset.","engine":"Paper Shaders","id":"paper-image-dithering-noise","name":"Image Dithering · Noise","qualityScore":58,"sourceLabel":"Paper · Apache-2.0","sourceUrl":"https://github.com/paper-design/shaders","category":"light","kind":"backgrounds","motion":{"materialId":"paper-image-dithering-noise","provider":"paper","motionModel":"static","supportsPngSnapshot":true,"supportsEditableSeek":false,"loop":{"kind":"static"}}},{"description":"A graphic dot lattice animated through geometric fields. Paper’s Wallpaper preset.","engine":"Paper Shaders","id":"paper-dot-grid-wallpaper","name":"Dot Grid · Wallpaper","qualityScore":60,"sourceLabel":"Paper · Apache-2.0","sourceUrl":"https://github.com/paper-design/shaders","category":"graphic","kind":"backgrounds","motion":{"materialId":"paper-dot-grid-wallpaper","provider":"paper","motionModel":"static","supportsPngSnapshot":true,"supportsEditableSeek":false,"loop":{"kind":"static"}}},{"description":"Image-aware ordered dithering with graphic color separation. Paper’s Retro preset.","engine":"Paper Shaders","id":"paper-image-dithering-retro","name":"Image Dithering · Retro","qualityScore":58,"sourceLabel":"Paper · Apache-2.0","sourceUrl":"https://github.com/paper-design/shaders","category":"light","kind":"backgrounds","motion":{"materialId":"paper-image-dithering-retro","provider":"paper","motionModel":"static","supportsPngSnapshot":true,"supportsEditableSeek":false,"loop":{"kind":"static"}}},{"description":"Image-driven halftone dots with tactile print texture. Paper’s Default preset.","engine":"Paper Shaders","id":"paper-halftone-dots","name":"Halftone Dots","qualityScore":56.8,"sourceLabel":"Paper · Apache-2.0","sourceUrl":"https://github.com/paper-design/shaders","category":"graphic","kind":"backgrounds","motion":{"materialId":"paper-halftone-dots","provider":"paper","motionModel":"static","supportsPngSnapshot":true,"supportsEditableSeek":false,"loop":{"kind":"static"}}},{"description":"Layered cyan, magenta, yellow, and black print screening. Paper’s Default preset.","engine":"Paper Shaders","id":"paper-halftone-cmyk","name":"Halftone CMYK","qualityScore":55.8,"sourceLabel":"Paper · Apache-2.0","sourceUrl":"https://github.com/paper-design/shaders","category":"graphic","kind":"backgrounds","motion":{"materialId":"paper-halftone-cmyk","provider":"paper","motionModel":"static","supportsPngSnapshot":true,"supportsEditableSeek":false,"loop":{"kind":"static"}}},{"description":"Image-driven halftone dots with tactile print texture. Paper’s LED screen preset.","engine":"Paper Shaders","id":"paper-halftone-dots-led-screen","name":"Halftone Dots · LED screen","qualityScore":56,"sourceLabel":"Paper · Apache-2.0","sourceUrl":"https://github.com/paper-design/shaders","category":"graphic","kind":"backgrounds","motion":{"materialId":"paper-halftone-dots-led-screen","provider":"paper","motionModel":"static","supportsPngSnapshot":true,"supportsEditableSeek":false,"loop":{"kind":"static"}}},{"description":"Layered cyan, magenta, yellow, and black print screening. Paper’s Drops preset.","engine":"Paper Shaders","id":"paper-halftone-cmyk-drops","name":"Halftone CMYK · Drops","qualityScore":55,"sourceLabel":"Paper · Apache-2.0","sourceUrl":"https://github.com/paper-design/shaders","category":"graphic","kind":"backgrounds","motion":{"materialId":"paper-halftone-cmyk-drops","provider":"paper","motionModel":"static","supportsPngSnapshot":true,"supportsEditableSeek":false,"loop":{"kind":"static"}}},{"description":"Image-driven halftone dots with tactile print texture. Paper’s Mosaic preset.","engine":"Paper Shaders","id":"paper-halftone-dots-mosaic","name":"Halftone Dots · Mosaic","qualityScore":56,"sourceLabel":"Paper · Apache-2.0","sourceUrl":"https://github.com/paper-design/shaders","category":"graphic","kind":"backgrounds","motion":{"materialId":"paper-halftone-dots-mosaic","provider":"paper","motionModel":"static","supportsPngSnapshot":true,"supportsEditableSeek":false,"loop":{"kind":"static"}}},{"description":"Layered cyan, magenta, yellow, and black print screening. Paper’s Newspaper preset.","engine":"Paper Shaders","id":"paper-halftone-cmyk-newspaper","name":"Halftone CMYK · Newspaper","qualityScore":55,"sourceLabel":"Paper · Apache-2.0","sourceUrl":"https://github.com/paper-design/shaders","category":"graphic","kind":"backgrounds","motion":{"materialId":"paper-halftone-cmyk-newspaper","provider":"paper","motionModel":"static","supportsPngSnapshot":true,"supportsEditableSeek":false,"loop":{"kind":"static"}}},{"description":"Image-driven halftone dots with tactile print texture. Paper’s Round and square preset.","engine":"Paper Shaders","id":"paper-halftone-dots-round-and-square","name":"Halftone Dots · Round and square","qualityScore":56,"sourceLabel":"Paper · Apache-2.0","sourceUrl":"https://github.com/paper-design/shaders","category":"graphic","kind":"backgrounds","motion":{"materialId":"paper-halftone-dots-round-and-square","provider":"paper","motionModel":"static","supportsPngSnapshot":true,"supportsEditableSeek":false,"loop":{"kind":"static"}}},{"description":"Layered cyan, magenta, yellow, and black print screening. Paper’s Vintage preset.","engine":"Paper Shaders","id":"paper-halftone-cmyk-vintage","name":"Halftone CMYK · Vintage","qualityScore":55,"sourceLabel":"Paper · Apache-2.0","sourceUrl":"https://github.com/paper-design/shaders","category":"graphic","kind":"backgrounds","motion":{"materialId":"paper-halftone-cmyk-vintage","provider":"paper","motionModel":"static","supportsPngSnapshot":true,"supportsEditableSeek":false,"loop":{"kind":"static"}}},{"id":"shader-effects-checkerboard","name":"Checkerboard","description":"Classic checkerboard pattern with two alternating colors · Textures","engine":"Shaders.com WebGPU","qualityScore":52.4,"sourceLabel":"Shaders.com · MIT","sourceUrl":"https://github.com/shader-effects-inc/shaders","category":"graphic","kind":"backgrounds","motion":{"materialId":"shader-effects-checkerboard","provider":"webgpu","motionModel":"procedural","supportsPngSnapshot":true,"supportsEditableSeek":true,"loop":{"kind":"continuous","periodMs":null}},"nativeControls":{"colorA":{"default":"#cccccc","type":"color","label":"Color A","group":"Colors","palette":"base"},"colorB":{"default":"#999999","type":"color","label":"Color B","group":"Colors","palette":"main"},"cells":{"default":8,"type":["range","map"],"min":1,"max":50,"step":1,"label":"Cells","group":"Effect","dimensional":"count-canvas-height"},"softness":{"default":0,"type":["range","map"],"min":0,"max":1,"step":0.1,"label":"Softness","group":"Effect"},"colorSpace":{"default":"linear","type":"select","options":[{"label":"Linear RGB","value":"linear"},{"label":"OKLCh","value":"oklch"},{"label":"OKLAB","value":"oklab"},{"label":"HSL","value":"hsl"},{"label":"HSV","value":"hsv"},{"label":"LCH","value":"lch"}],"label":"Color Space","group":"Colors"}},"settingsKey":"effectProps","requiresWebGPU":true},{"id":"shader-effects-grid","name":"Grid","description":"Simple grid lines pattern with adjustable thickness and rotation · Textures","engine":"Shaders.com WebGPU","qualityScore":52.3,"sourceLabel":"Shaders.com · MIT","sourceUrl":"https://github.com/shader-effects-inc/shaders","category":"graphic","kind":"backgrounds","motion":{"materialId":"shader-effects-grid","provider":"webgpu","motionModel":"procedural","supportsPngSnapshot":true,"supportsEditableSeek":true,"loop":{"kind":"continuous","periodMs":null}},"nativeControls":{"color":{"default":"#ffffff","type":"color","label":"Line Color","group":"Colors","palette":"main"},"cellColor":{"default":"#00000000","type":"color","label":"Cell Color","group":"Colors","palette":"base"},"cells":{"default":10,"type":["range","map"],"min":1,"max":50,"step":1,"label":"Cells","group":"Effect"},"thickness":{"default":1,"type":["range","map"],"min":0,"max":20,"step":0.1,"label":"Thickness","group":"Effect"},"rotation":{"default":0,"type":["range","map"],"min":0,"max":360,"step":1,"label":"Rotation","group":"Effect"},"softness":{"default":0,"type":["range","map"],"min":0,"max":1,"step":0.01,"label":"Softness","group":"Effect"},"variation":{"default":0,"type":["range","map"],"min":0,"max":1,"step":0.01,"label":"Variation","group":"Effect"},"colorSpace":{"default":"linear","type":"select","options":[{"label":"Linear RGB","value":"linear"},{"label":"OKLCh","value":"oklch"},{"label":"OKLAB","value":"oklab"},{"label":"HSL","value":"hsl"},{"label":"HSV","value":"hsv"},{"label":"LCH","value":"lch"}],"label":"Color Space","group":"Colors"}},"settingsKey":"effectProps","requiresWebGPU":true}],"framePersistence":{"appearance":"lossless-png-snapshot","editableRecipe":"material settings plus native engine frame state","history":"Time samples are not recorded live history or a proven material loop.","storage":"Content-addressed IndexedDB blobs; portable CanvasDocument embeds PNG asset bytes."},"palettes":[{"colors":["#050505","#F4F4F0","#737373"],"description":"Neutral chrome with a clean paper highlight.","id":"monochrome-chrome","name":"Monochrome chrome"},{"colors":["#0D0E12","#D7E6FF","#7A82A1"],"description":"Cold silver with a blue-violet reflected edge.","id":"mercury","name":"Mercury"},{"colors":["#110829","#865CFF","#F3A6FF"],"description":"Deep ultraviolet lifted by an electric pink glint.","id":"ultraviolet","name":"Ultraviolet"},{"colors":["#081310","#D6FF45","#3CD6A3"],"description":"Dark mineral green with a sharp signal-lime edge.","id":"signal-lime","name":"Signal lime"},{"colors":["#1A0A07","#FF7A45","#FFD2A8"],"description":"Burnished copper moving into a warm specular highlight.","id":"copper-heat","name":"Copper heat"},{"colors":["#07131C","#5BD8FF","#EAFBFF"],"description":"Near-black blue, cyan energy, and an icy white crest.","id":"arctic","name":"Arctic"},{"colors":["#0C0C0E","#FF4D2E","#F2EEE8"],"description":"Ink, vermilion, and warm paper for editorial motion.","id":"vermilion-ink","name":"Vermilion ink"},{"colors":["#07112F","#345DFF","#A7D8FF"],"description":"Saturated cobalt with a soft atmospheric bloom.","id":"cobalt-bloom","name":"Cobalt bloom"},{"colors":["#07090D","#394457","#F5F7FA"],"description":"Surface Lab’s quiet directional field with deep edge contrast.","id":"surface-signal-axis","name":"Signal axis"},{"colors":["#06070A","#28334A","#EEF2FF"],"description":"Surface Lab’s architectural dark-blue terraces and cool highlight.","id":"surface-signal-terraces","name":"Signal terraces"},{"colors":["#25113D","#FF763D","#FFD06A"],"description":"Surface Lab’s warm amber, coral, and lilac orbit palette.","id":"surface-solar-orbit","name":"Solar orbit"},{"colors":["#061A22","#28B9B1","#B9FFF2"],"description":"Surface Lab’s mineral cyan field with an icy mint crest.","id":"surface-mineral-wave","name":"Mineral wave"},{"colors":["#DDD8CE","#F3F0EA","#FFFFFF"],"description":"Surface Lab’s warm paper neutrals and focused white aperture.","id":"surface-paper-aperture","name":"Paper aperture"},{"colors":["#F4F4F0","#181818","#737373"],"description":"Surface Lab’s monochrome ink-and-paper dither palette.","id":"surface-ink-dither","name":"Ink dither"},{"colors":["#130A33","#795CFF","#7BFFD9"],"description":"Surface Lab’s electric violet and signal-mint pixel palette.","id":"surface-signal-dither","name":"Signal dither"}],"schemaVersion":1,"sharedBy":["animation","material"],"imageEffects":{"categories":["Stylize","Blurs","Distortions","Adjustments","Transitions","Interactive","Shape Effects"],"count":97,"effects":[{"category":"Shape Effects","description":"Optically realistic glass lens driven in a custom shape","id":"shader-effects-glass","name":"Glass","nativeControls":{"surface":{"type":"select","label":"Surface","group":"Framing","default":"canvas","options":[{"label":"Full canvas","value":"canvas"},{"label":"Shape","value":"shape"}]},"origin":{"default":"center","type":"origin","label":"Origin","group":"Position"},"center":{"default":{"x":0.5,"y":0.5},"type":"position","label":"Center","group":"Position","units":["%","px"]},"scale":{"default":1,"type":["range","map"],"min":0.1,"max":3,"step":0.01,"label":"Scale","group":"Position"},"rotation":{"default":0,"type":"range","min":0,"max":360,"step":1,"label":"Rotation","group":"Position"},"cutout":{"default":false,"type":"checkbox","label":"Cutout","group":"Glass"},"refraction":{"default":1,"type":["range","map"],"min":0,"max":2,"step":0.01,"label":"Refraction","group":"Glass"},"edgeSoftness":{"default":0.1,"type":["range","map"],"min":0,"max":1,"step":0.01,"label":"Edge Softness","group":"Glass"},"blur":{"default":0,"type":"range","min":0,"max":20,"step":0.1,"label":"Blur","group":"Glass"},"thickness":{"default":0.2,"type":["range","map"],"min":0,"max":1,"step":0.01,"label":"Thickness","group":"Glass"},"aberration":{"default":0.5,"type":["range","map"],"min":0,"max":1,"step":0.01,"label":"Aberration","group":"Glass"},"innerZoom":{"default":1,"type":["range","map"],"min":0.5,"max":3,"step":0.01,"label":"Inner Zoom","group":"Glass"},"lightAngle":{"default":300,"type":"range","min":0,"max":360,"step":1,"label":"Light Angle","group":"Highlight"},"highlight":{"default":0.05,"type":["range","map"],"min":0,"max":2,"step":0.01,"label":"Highlight","group":"Highlight"},"highlightColor":{"default":"#ffffff","type":"color","label":"Highlight Color","group":"Highlight","palette":"highlight"},"highlightSoftness":{"default":0.5,"type":["range","map"],"min":0,"max":1,"step":0.01,"label":"Highlight Softness","group":"Highlight"},"fresnel":{"default":0.1,"type":["range","map"],"min":0,"max":1,"step":0.01,"label":"Fresnel","group":"Fresnel"},"fresnelSoftness":{"default":0.1,"type":["range","map"],"min":0,"max":1,"step":0.01,"label":"Fresnel Softness","group":"Fresnel"},"fresnelColor":{"default":"#ffffff","type":"color","label":"Fresnel Color","group":"Fresnel","palette":"highlight"},"tintColor":{"default":"#ffffff","type":"color","label":"Tint Color","group":"Tint","palette":"main"},"tintIntensity":{"default":0,"type":["range","map"],"min":0,"max":1,"step":0.01,"label":"Tint Intensity","group":"Tint"},"tintPreserveLuminosity":{"default":true,"type":"checkbox","label":"Preserve Luminosity","group":"Tint"},"shape":{"default":"{\"type\":\"sphere3D\",\"radius\":0.35}","type":"shape","label":"Shape","group":"Shape"},"shapeSdfUrl":{"default":""},"shapeType":{"default":""}},"preview":"/shader-previews/shader-effects-glass.webp"},{"category":"Shape Effects","description":"Diamond-like crystal lens with faceted refraction.","id":"shader-effects-crystal","name":"Crystal","nativeControls":{"surface":{"type":"select","label":"Surface","group":"Framing","default":"canvas","options":[{"label":"Full canvas","value":"canvas"},{"label":"Shape","value":"shape"}]},"origin":{"default":"center","type":"origin","label":"Origin","group":"Position"},"center":{"default":{"x":0.5,"y":0.5},"type":"position","label":"Center","group":"Position","units":["%","px"]},"scale":{"default":1,"type":"range","min":0.1,"max":3,"step":0.01,"label":"Scale","group":"Position"},"rotation":{"default":0,"type":"range","min":0,"max":360,"step":1,"label":"Rotation","group":"Position"},"cutout":{"default":false,"type":"checkbox","label":"Cutout","group":"Crystal"},"refraction":{"default":0.5,"type":"range","min":0,"max":3,"step":0.01,"label":"Refraction","group":"Crystal"},"dispersion":{"default":0.5,"type":"range","min":0,"max":2,"step":0.01,"label":"Dispersion","group":"Crystal"},"facets":{"default":5,"type":"range","min":3,"max":24,"step":1,"label":"Facets","group":"Crystal"},"fresnel":{"default":0.05,"type":"range","min":0,"max":1,"step":0.01,"label":"Fresnel","group":"Fresnel"},"fresnelSoftness":{"default":1,"type":"range","min":0,"max":2,"step":0.01,"label":"Fresnel Softness","group":"Fresnel"},"fresnelColor":{"default":"#ffffff","type":"color","label":"Fresnel Color","group":"Fresnel","palette":"highlight"},"edgeSoftness":{"default":0,"type":"range","min":0,"max":1,"step":0.01,"label":"Edge Softness","group":"Crystal"},"innerZoom":{"default":1.5,"type":"range","min":0.5,"max":3,"step":0.01,"label":"Inner Zoom","group":"Crystal"},"lightAngle":{"default":270,"type":"range","min":0,"max":360,"step":1,"label":"Light Angle","group":"Lighting"},"highlights":{"default":0.5,"type":"range","min":0,"max":2,"step":0.01,"label":"Highlights","group":"Lighting"},"shadows":{"default":0.3,"type":"range","min":0,"max":1,"step":0.01,"label":"Shadows","group":"Lighting"},"brightness":{"default":1.2,"type":"range","min":0.5,"max":3,"step":0.01,"label":"Brightness","group":"Lighting"},"tintColor":{"default":"#e8e0ff","type":"color","label":"Tint Color","group":"Tint","palette":"main"},"tintIntensity":{"default":0,"type":"range","min":0,"max":1,"step":0.01,"label":"Tint Intensity","group":"Tint"},"tintPreserveLuminosity":{"default":true,"type":"checkbox","label":"Preserve Luminosity","group":"Tint"},"shape":{"default":"{\"type\":\"sphere3D\",\"radius\":0.35}","type":"shape","label":"Shape","group":"Shape"},"shapeSdfUrl":{"default":""},"shapeType":{"default":""}},"preview":"/shader-previews/shader-effects-crystal.webp"},{"category":"Stylize","description":"Copper-plate line engraving — the image is redrawn as flowing line work whose weight swells with darkness, lines displaced by the form like a banknote portrait: a single plate, cross-hatched shadow plates, or one continuous spiral cut","id":"shader-effects-engraving","name":"Engraving","nativeControls":{"style":{"default":"crosshatch","type":"select","options":[{"label":"Line","value":"line"},{"label":"Cross-Hatch","value":"crosshatch"},{"label":"Spiral","value":"spiral"}],"label":"Style","group":"Lines"},"frequency":{"default":90,"type":["range","map"],"min":20,"max":300,"step":1,"label":"Frequency","group":"Lines"},"angle":{"default":8,"type":["range","map"],"min":0,"max":360,"step":1,"label":"Angle","group":"Lines","condition":{"style":"line"}},"center":{"default":{"x":0.5,"y":0.5},"type":"position","label":"Center","group":"Lines","condition":{"style":"spiral"}},"relief":{"default":0.6,"type":["range","map"],"min":0,"max":2,"step":0.01,"label":"Relief","group":"Lines"},"waviness":{"default":0.35,"type":["range","map"],"min":0,"max":1,"step":0.01,"label":"Waviness","group":"Lines"},"contrast":{"default":1.15,"type":["range","map"],"min":0.25,"max":3,"step":0.01,"label":"Contrast","group":"Tone"},"inkColor":{"default":"#1a1410","type":"color","label":"Ink","group":"Colors","palette":"base"},"paperColor":{"default":"#f4eee2","type":"color","label":"Paper","group":"Colors","palette":"highlight"}},"preview":"/shader-previews/shader-effects-engraving.webp"},{"category":"Stylize","description":"Halftone dot pattern effect for printing aesthetics","id":"shader-effects-halftone","name":"Halftone","nativeControls":{"style":{"default":"classic","type":"select","options":[{"label":"Simple","value":"classic"},{"label":"CMYK Print","value":"cmyk"}],"label":"Style","group":"Effect"},"frequency":{"default":100,"type":["range","map"],"min":10,"max":300,"step":1,"label":"Frequency","group":"Effect"},"angle":{"default":45,"type":["range","map"],"min":0,"max":360,"step":1,"label":"Angle","group":"Effect","condition":{"style":"classic"}},"cyanAngle":{"default":15,"type":["range","map"],"min":0,"max":360,"step":1,"label":"Cyan Angle","group":"Plate Angles","condition":{"style":"cmyk"}},"magentaAngle":{"default":75,"type":["range","map"],"min":0,"max":360,"step":1,"label":"Magenta Angle","group":"Plate Angles","condition":{"style":"cmyk"}},"yellowAngle":{"default":0,"type":["range","map"],"min":0,"max":360,"step":1,"label":"Yellow Angle","group":"Plate Angles","condition":{"style":"cmyk"}},"blackAngle":{"default":45,"type":["range","map"],"min":0,"max":360,"step":1,"label":"Black Angle","group":"Plate Angles","condition":{"style":"cmyk"}},"misprint":{"default":0,"type":["range","map"],"min":0,"max":0.01,"step":0.0005,"label":"Misprint","group":"Effect","condition":{"style":"cmyk"}},"misprintAngle":{"default":0,"type":["range","map"],"min":0,"max":360,"step":1,"label":"Misprint Angle","group":"Effect","condition":{"style":"cmyk"}},"paperColor":{"default":"#ffffff","type":"color","label":"Paper","group":"Inks","condition":{"style":"cmyk"},"palette":"highlight"},"cyanColor":{"default":"#00ffff","type":"color","label":"Cyan","group":"Inks","condition":{"style":"cmyk"}},"magentaColor":{"default":"#ff00ff","type":"color","label":"Magenta","group":"Inks","condition":{"style":"cmyk"}},"yellowColor":{"default":"#ffff00","type":"color","label":"Yellow","group":"Inks","condition":{"style":"cmyk"}},"blackColor":{"default":"#000000","type":"color","label":"Black","group":"Inks","condition":{"style":"cmyk"},"palette":"base"}},"preview":"/shader-previews/shader-effects-halftone.webp"},{"category":"Stylize","description":"Convert imagery to ASCII character art","id":"shader-effects-ascii","name":"Ascii","nativeControls":{"characters":{"default":"@%#*+=-:.","type":"text","label":"Characters","group":"Effect"},"cellSize":{"default":30,"type":"range","min":8,"max":100,"step":1,"label":"Cell Size","group":"Effect"},"fontFamily":{"default":"JetBrains Mono","type":"select","options":[{"label":"Azeret Mono","value":"Azeret Mono"},{"label":"Courier Prime","value":"Courier Prime"},{"label":"Cutive Mono","value":"Cutive Mono"},{"label":"Fira Code","value":"Fira Code"},{"label":"Geist Mono","value":"Geist Mono"},{"label":"IBM Plex Mono","value":"IBM Plex Mono"},{"label":"JetBrains Mono","value":"JetBrains Mono"},{"label":"Major Mono Display","value":"Major Mono Display"},{"label":"Martian Mono","value":"Martian Mono"},{"label":"Nova Mono","value":"Nova Mono"},{"label":"Press Start 2P","value":"Press Start 2P"},{"label":"Roboto Mono","value":"Roboto Mono"},{"label":"Share Tech Mono","value":"Share Tech Mono"},{"label":"Silkscreen","value":"Silkscreen"},{"label":"Source Code Pro","value":"Source Code Pro"},{"label":"Space Mono","value":"Space Mono"},{"label":"Syne Mono","value":"Syne Mono"},{"label":"VT323","value":"VT323"},{"label":"Xanh Mono","value":"Xanh Mono"}],"label":"Font Family","group":"Font"},"spacing":{"default":1,"type":["range","map"],"min":0,"max":1,"step":0.01,"label":"Character Size","group":"Effect"},"gamma":{"default":1,"type":["range","map"],"min":0.25,"max":3,"step":0.01,"label":"Gamma","group":"Effect"},"alphaThreshold":{"default":0,"type":"range","min":0,"max":1,"step":0.01,"label":"Alpha Threshold","group":"Effect"},"preserveAlpha":{"default":true,"type":"checkbox","label":"Preserve Alpha","group":"Effect"}},"preview":"/shader-previews/shader-effects-ascii.webp"},{"category":"Stylize","description":"Dithering effect with multiple pattern options","id":"shader-effects-dither","name":"Dither","nativeControls":{"pattern":{"default":"bayer4","type":"select","options":[{"label":"Bayer 2x2","value":"bayer2"},{"label":"Bayer 4x4","value":"bayer4"},{"label":"Bayer 8x8","value":"bayer8"},{"label":"Clustered Dot","value":"clusteredDot"},{"label":"Blue Noise","value":"blueNoise"},{"label":"White Noise","value":"whiteNoise"},{"label":"Floyd-Steinberg","value":"floydSteinberg"}],"label":"Pattern","group":"Effect"},"pixelSize":{"default":4,"type":"range","min":1,"max":20,"step":1,"label":"Pixel Size","group":"Effect"},"threshold":{"default":0.5,"type":["range","map"],"min":0,"max":1,"step":0.01,"label":"Threshold","group":"Effect"},"spread":{"default":1,"type":["range","map"],"min":0,"max":1,"step":0.01,"label":"Spread","group":"Effect"},"colorMode":{"default":"custom","type":"select","options":[{"label":"Custom Colors","value":"custom"},{"label":"Source Colors","value":"source"}],"label":"Color Mode","group":"Colors"},"colorA":{"default":"#000000","type":"color","label":"Dark Color","condition":{"colorMode":"custom"},"group":"Colors","palette":"base"},"colorB":{"default":"#ffffff","type":"color","label":"Light Color","condition":{"colorMode":"custom"},"group":"Colors","palette":"highlight"}},"preview":"/shader-previews/shader-effects-dither.webp"},{"category":"Stylize","description":"Maps source luminance through an animated color gradient (Photoshop-style gradient map)","id":"shader-effects-gradient-map","name":"Gradient Map","nativeControls":{"palette":{"default":"custom","type":"select","options":[{"label":"Rainbow","value":"rainbow"},{"label":"Sunset","value":"sunset"},{"label":"Ocean","value":"ocean"},{"label":"Fire","value":"fire"},{"label":"Pastel","value":"pastel"},{"label":"Neon","value":"neon"},{"label":"Custom Colors","value":"custom"}],"label":"Palette","group":"Colors"},"colorLow":{"default":"#1a0b2e","type":"color","label":"Shadows","group":"Colors","condition":{"palette":"custom"},"palette":"base"},"colorMid":{"default":"#e94560","type":"color","label":"Midtones","group":"Colors","condition":{"palette":"custom"},"palette":"main"},"colorHigh":{"default":"#f9ed69","type":"color","label":"Highlights","group":"Colors","condition":{"palette":"custom"},"palette":"highlight"},"speed":{"default":0.15,"type":["range","map"],"min":-2,"max":2,"step":0.01,"label":"Speed","group":"Animation","hidden":true},"contrast":{"default":1,"type":["range","map"],"min":0,"max":3,"step":0.01,"label":"Contrast","group":"Effect"},"blackPoint":{"default":0,"type":["range","map"],"min":0,"max":1,"step":0.01,"label":"Black Point","group":"Effect"},"whitePoint":{"default":1,"type":["range","map"],"min":0,"max":1,"step":0.01,"label":"White Point","group":"Effect"},"strength":{"default":1,"type":["range","map"],"min":0,"max":1,"step":0.01,"label":"Strength","group":"Effect"},"colorSpace":{"default":"oklch","type":"select","options":[{"label":"Linear RGB","value":"linear"},{"label":"OKLCh","value":"oklch"},{"label":"OKLAB","value":"oklab"},{"label":"HSL","value":"hsl"},{"label":"HSV","value":"hsv"},{"label":"LCH","value":"lch"}],"label":"Color Space","group":"Colors","condition":{"palette":"custom"}}},"preview":"/shader-previews/shader-effects-gradient-map.webp"},{"category":"Stylize","description":"Renders content as a chalk drawing on a blackboard, with edge strokes and cross-hatch shading","id":"shader-effects-chalkboard","name":"Chalkboard","nativeControls":{"boardColor":{"default":"#000000","type":"color","label":"Board","group":"Colors","palette":"base"},"chalkColor":{"default":"#eceadb","type":"color","label":"Chalk","group":"Colors","palette":"highlight"},"edgeSensitivity":{"default":0.5,"type":["range","map"],"min":0,"max":1,"step":0.01,"label":"Edge Sensitivity","group":"Effect"},"edgeThickness":{"default":1.5,"type":["range","map"],"min":0.5,"max":4,"step":0.1,"label":"Edge Thickness","group":"Effect"},"shading":{"default":0.05,"type":["range","map"],"min":0,"max":1,"step":0.01,"label":"Shading","group":"Effect"},"hatchScale":{"default":16,"type":["range","map"],"min":3,"max":24,"step":0.5,"label":"Hatch Scale","group":"Effect"},"grain":{"default":0.45,"type":["range","map"],"min":0,"max":1,"step":0.01,"label":"Grain","group":"Effect"}},"preview":"/shader-previews/shader-effects-chalkboard.webp"},{"category":"Stylize","description":"Retro CRT monitor simulation with scanlines","id":"shader-effects-crtscreen","name":"CRTScreen","nativeControls":{"pixelSize":{"default":128,"type":["range","map"],"min":8,"max":128,"step":1,"label":"Pixel Size","group":"Effect"},"colorShift":{"default":1,"type":["range","map"],"min":0,"max":10,"step":0.1,"label":"Color Shift","group":"Effect"},"scanlineIntensity":{"default":0.3,"type":["range","map"],"min":0,"max":1,"step":0.1,"label":"Scanline Intensity","group":"Effect"},"scanlineFrequency":{"default":200,"type":["range","map"],"min":100,"max":800,"step":10,"label":"Scanline Frequency","group":"Effect"},"brightness":{"default":1,"type":["range","map"],"min":0.5,"max":2,"step":0.1,"label":"Brightness","group":"Adjustments"},"contrast":{"default":1,"type":["range","map"],"min":0.5,"max":2,"step":0.1,"label":"Contrast","group":"Adjustments"},"vignetteIntensity":{"default":1,"type":["range","map"],"min":0,"max":1,"step":0.1,"label":"Vignette Intensity","group":"Effect"},"vignetteRadius":{"default":0.5,"type":["range","map"],"min":0,"max":1,"step":0.01,"label":"Vignette Radius","group":"Effect"}},"preview":"/shader-previews/shader-effects-crtscreen.webp"},{"category":"Stylize","description":"Painterly watercolor look — Kuwahara flattening, pigment edge darkening, paper grain and bleeding","id":"shader-effects-watercolor","name":"Watercolor","nativeControls":{"radius":{"default":3,"type":"range","min":1,"max":8,"step":1,"label":"Brush","group":"Effect","hidden":true},"bleed":{"default":1,"type":["range","map"],"min":0,"max":3,"step":0.01,"label":"Bleed","group":"Effect"},"strength":{"default":1,"type":["range","map"],"min":0,"max":1,"step":0.01,"label":"Strength","group":"Effect"},"paper":{"default":0.35,"type":["range","map"],"min":0,"max":1,"step":0.01,"label":"Paper","group":"Effect"},"paperColor":{"default":"#fbf7ec","type":"color","label":"Paper Color","group":"Colors","palette":"highlight"}},"preview":"/shader-previews/shader-effects-watercolor.webp"},{"category":"Stylize","description":"Photorealistic film light leak — warm overexposed light bleeding in from a draggable anchor point, with streak bands, chromatic fringing, and slow breathing that evolves over time","id":"shader-effects-light-leak","name":"Light Leak","nativeControls":{"position":{"default":{"x":0.95,"y":0.4},"type":"position","label":"Position","group":"Leak","units":["%","px"]},"spread":{"default":0.55,"type":["range","map"],"min":0.1,"max":1.5,"step":0.01,"label":"Spread","group":"Leak"},"intensity":{"default":0.15,"type":["range","map"],"min":0,"max":1,"step":0.01,"label":"Intensity","group":"Leak"},"streaks":{"default":0.6,"type":["range","map"],"min":0,"max":1,"step":0.01,"label":"Streaks","group":"Leak"},"colorHot":{"default":"#fff3c4","type":"color","label":"Hot Core","group":"Colors","palette":"highlight"},"colorMid":{"default":"#ff7a2f","type":"color","label":"Midtone","group":"Colors","palette":"main"},"colorFringe":{"default":"#a63d8f","type":"color","label":"Fringe","group":"Colors","palette":"base"},"flicker":{"default":0.35,"type":["range","map"],"min":0,"max":1,"step":0.01,"label":"Flicker","group":"Animation"},"speed":{"default":1,"type":"range","min":0,"max":4,"step":0.1,"label":"Speed","group":"Animation","hidden":true},"seed":{"default":0,"type":["range","map"],"min":0,"max":100,"step":1,"label":"Seed","group":"Animation"}},"preview":"/shader-previews/shader-effects-light-leak.webp"},{"category":"Stylize","description":"Explodes the child content into a breathing 3D field of particles — bright areas float toward you and dark areas recede, the whole relief can be orbited with the camera rotations, and the cursor physically throws particles that spring back home","id":"shader-effects-particle-field","name":"Particle Field","nativeControls":{"count":{"default":15000,"type":"range","min":1000,"max":40000,"step":500,"label":"Count","group":"Field"},"depthSource":{"default":"luminance","type":"select","options":[{"value":"luminance","label":"Luminance"},{"value":"luminanceInverted","label":"Luminance (Inverted)"},{"value":"red","label":"Red"},{"value":"green","label":"Green"},{"value":"blue","label":"Blue"},{"value":"saturation","label":"Saturation"},{"value":"alpha","label":"Alpha"}],"label":"Depth Source","group":"Field"},"depth":{"default":0.7,"type":["range","map"],"min":0,"max":2,"step":0.01,"label":"Depth","group":"Field"},"particleShape":{"default":"dot","type":"select","options":[{"label":"Dot","value":"dot"},{"label":"Square","value":"square"},{"label":"Glow","value":"glow"}],"label":"Shape","group":"Look"},"particleSize":{"default":0.75,"type":["range","map"],"min":0.3,"max":3,"step":0.01,"label":"Particle Size","group":"Look"},"depthShading":{"default":0.6,"type":"range","min":0,"max":1,"step":0.01,"label":"Depth Shading","group":"Look"},"wobble":{"default":0.35,"type":["range","map"],"min":0,"max":1,"step":0.01,"label":"Wobble","group":"Motion"},"zoom":{"default":1,"type":["range","map"],"min":0.3,"max":2.5,"step":0.01,"label":"Zoom","group":"Camera"},"rotationX":{"default":0,"type":["range","map"],"min":-180,"max":180,"step":1,"label":"Rotate X","group":"Camera"},"rotationY":{"default":0,"type":["range","map"],"min":-180,"max":180,"step":1,"label":"Rotate Y","group":"Camera"},"rotationZ":{"default":0,"type":["range","map"],"min":-180,"max":180,"step":1,"label":"Rotate Z","group":"Camera"},"offsetX":{"default":0,"type":["range","map"],"min":-1,"max":1,"step":0.01,"label":"Offset X","group":"Camera"},"offsetY":{"default":0,"type":["range","map"],"min":-1,"max":1,"step":0.01,"label":"Offset Y","group":"Camera"},"cursorMode":{"default":"push","type":"select","options":[{"value":"none","label":"None"},{"value":"push","label":"Push"},{"value":"pull","label":"Pull"}],"label":"Cursor Mode","group":"Interaction"},"cursorStrength":{"default":0.8,"type":"range","min":0,"max":2,"step":0.01,"label":"Cursor Strength","group":"Interaction"},"cursorRadius":{"default":0.2,"type":"range","min":0.05,"max":1,"step":0.01,"label":"Cursor Radius","group":"Interaction"}},"preview":"/shader-previews/shader-effects-particle-field.webp"},{"category":"Shape Effects","description":"Embossed / debossed relief shading on top of child content, driven by a custom shape","id":"shader-effects-emboss","name":"Emboss","nativeControls":{"surface":{"type":"select","label":"Surface","group":"Framing","default":"canvas","options":[{"label":"Full canvas","value":"canvas"},{"label":"Shape","value":"shape"}]},"origin":{"default":"center","type":"origin","label":"Origin","group":"Position"},"center":{"default":{"x":0.5,"y":0.5},"type":"position","label":"Center","group":"Position","units":["%","px"]},"scale":{"default":1,"type":"range","min":0.1,"max":3,"step":0.01,"label":"Scale","group":"Position"},"rotation":{"default":0,"type":"range","min":0,"max":360,"step":1,"label":"Rotation","group":"Position"},"depth":{"default":-0.5,"type":"range","min":-1,"max":1,"step":0.01,"label":"Depth","group":"Relief"},"lightAngle":{"default":260,"type":["range","map"],"min":0,"max":360,"step":1,"label":"Light Angle","group":"Lighting"},"lightIntensity":{"default":0.6,"type":["range","map"],"min":0,"max":2,"step":0.01,"label":"Light Intensity","group":"Lighting"},"shadowIntensity":{"default":0.3,"type":["range","map"],"min":0,"max":1,"step":0.01,"label":"Shadow Intensity","group":"Relief"},"shape":{"default":"{\"type\":\"sphere3D\",\"radius\":0.35}","type":"shape","label":"Shape","group":"Shape"},"shapeSdfUrl":{"default":""},"shapeType":{"default":""}},"preview":"/shader-previews/shader-effects-emboss.webp"},{"category":"Stylize","description":"Analog VHS tape with intermittent tape damage, chroma bleed, and per-scanline noise","id":"shader-effects-vhs","name":"VHS","nativeControls":{"wobble":{"default":1,"type":["range","map"],"min":0,"max":5,"step":0.01,"label":"Wobble","group":"Effect"},"scanlineNoise":{"default":0.6,"type":["range","map"],"min":0,"max":1,"step":0.01,"label":"Scanline Noise","group":"Effect"},"smear":{"default":0.2,"type":["range","map"],"min":-2,"max":2,"step":0.01,"label":"Smear","group":"Effect"},"speed":{"default":1,"type":"range","min":0.1,"max":3,"step":0.1,"label":"Speed","group":"Effect","hidden":true}},"preview":"/shader-previews/shader-effects-vhs.webp"},{"category":"Stylize","description":"Digital glitch that melts pixels and distorts colors","id":"shader-effects-glitch","name":"Glitch","nativeControls":{"intensity":{"default":0.85,"type":["range","map"],"min":0,"max":1,"step":0.01,"label":"Intensity","group":"Effect"},"speed":{"default":1,"type":"range","min":0.1,"max":5,"step":0.1,"label":"Speed","group":"Effect","hidden":true},"rgbShift":{"default":5,"type":["range","map"],"min":0,"max":20,"step":0.5,"label":"RGB Shift","group":"Effect"},"blockDensity":{"default":10,"type":["range","map"],"min":2,"max":50,"step":1,"label":"Block Density","group":"Effect"},"colorBarIntensity":{"default":0.2,"type":["range","map"],"min":0,"max":1,"step":0.01,"label":"Color Bars","group":"Effect"},"mirrorAmount":{"default":0.3,"type":["range","map"],"min":0,"max":1,"step":0.01,"label":"Mirror","group":"Effect"},"scanlineIntensity":{"default":0.2,"type":["range","map"],"min":0,"max":1,"step":0.01,"label":"Scanlines","group":"Effect"}},"preview":"/shader-previews/shader-effects-glitch.webp"},{"category":"Distortions","description":"Full-screen fluted glass effect — refracts content through repeating cylindrical bars","id":"shader-effects-fluted-glass","name":"Fluted Glass","nativeControls":{"shape":{"default":"bars","type":"select","options":[{"label":"Bars","value":"bars"},{"label":"Rounded","value":"rounded"},{"label":"Waves","value":"waves"}],"label":"Shape","group":"Effect"},"angle":{"default":0,"type":["range","map"],"min":0,"max":360,"step":1,"label":"Angle","group":"Effect"},"frequency":{"default":10,"type":["range","map"],"min":1,"max":20,"step":1,"label":"Frequency","group":"Effect"},"softness":{"default":0.5,"type":["range","map"],"min":0,"max":1,"step":0.01,"label":"Softness","group":"Effect"},"waveAmplitude":{"default":0.06,"type":["range","map"],"min":0,"max":0.5,"step":0.01,"label":"Wave Amplitude","group":"Effect","condition":{"shape":"waves"}},"waveFrequency":{"default":1.5,"type":["range","map"],"min":0.1,"max":10,"step":0.1,"label":"Wave Frequency","group":"Effect","condition":{"shape":"waves"}},"speed":{"default":0.5,"type":"range","min":-1,"max":1,"step":0.01,"label":"Speed","group":"Animation","hidden":true},"refraction":{"default":1.5,"type":["range","map"],"min":0,"max":4,"step":0.01,"label":"Refraction","group":"Effect"},"aberration":{"default":0.2,"type":["range","map"],"min":0,"max":1,"step":0.01,"label":"Aberration","group":"Effect"},"lightAngle":{"default":30,"type":"range","min":-90,"max":90,"step":1,"label":"Light Angle","group":"Highlight"},"highlight":{"default":0.2,"type":["range","map"],"min":0,"max":2,"step":0.01,"label":"Highlight","group":"Highlight"},"highlightSoftness":{"default":0.3,"type":["range","map"],"min":0,"max":1,"step":0.01,"label":"Highlight Softness","group":"Highlight"},"highlightColor":{"default":"#ffffff","type":"color","label":"Highlight Color","group":"Highlight","palette":"highlight"},"edges":{"default":"mirror","type":"select","options":[{"label":"Stretch","value":"stretch"},{"label":"Transparent","value":"transparent"},{"label":"Mirror","value":"mirror"},{"label":"Wrap","value":"wrap"}],"label":"Edges","group":"Effect"}},"preview":"/shader-previews/shader-effects-fluted-glass.webp"},{"category":"Distortions","description":"Refraction-like distortion in a tile grid pattern","id":"shader-effects-glass-tiles","name":"Glass Tiles","nativeControls":{"intensity":{"default":2,"type":["range","map"],"min":0,"max":10,"step":0.1,"label":"Intensity","group":"Effect"},"tileCount":{"default":20,"type":["range","map"],"min":5,"max":50,"step":1,"label":"Tile Count","group":"Effect"},"rotation":{"default":0,"type":["range","map"],"min":0,"max":360,"step":1,"label":"Rotation","group":"Effect"},"roundness":{"default":0,"type":["range","map"],"min":0,"max":1,"step":0.1,"label":"Roundness","group":"Effect"}},"preview":"/shader-previews/shader-effects-glass-tiles.webp"},{"category":"Distortions","description":"Create a kaleidoscope effect with radial mirrored segments","id":"shader-effects-kaleidoscope","name":"Kaleidoscope","nativeControls":{"center":{"default":{"x":0.5,"y":0.5},"type":"position","label":"Center","group":"Position"},"segments":{"default":6,"type":["range","map"],"min":2,"max":24,"step":1,"label":"Segments","group":"Effect"},"angle":{"default":0,"type":["range","map"],"min":0,"max":360,"step":1,"label":"Angle","group":"Effect"},"edges":{"default":"mirror","type":"select","options":[{"label":"Stretch","value":"stretch"},{"label":"Transparent","value":"transparent"},{"label":"Mirror","value":"mirror"},{"label":"Wrap","value":"wrap"}],"label":"Edges","group":"Effect"}},"preview":"/shader-previews/shader-effects-kaleidoscope.webp"},{"category":"Distortions","description":"Wraps child content onto a 3D raymarched shape with lighting.","id":"shader-effects-form3-d","name":"Form3 D","nativeControls":{"shape3d":{"default":"{\"type\":\"ribbon\",\"angle\":0,\"twist\":50,\"width\":40,\"thickness\":20,\"seed\":0}","type":"shape3d","label":"Shape","group":"Shape"},"shape3dType":{"default":"ribbon"},"center":{"default":{"x":0.5,"y":0.5},"type":"position","label":"Center","group":"Position"},"zoom":{"default":50,"type":["range","map"],"min":10,"max":200,"step":1,"label":"Zoom","group":"Scene"},"glossiness":{"default":50,"type":["range","map"],"min":0,"max":200,"step":1,"label":"Glossiness","group":"Lighting"},"lighting":{"default":50,"type":["range","map"],"min":0,"max":200,"step":1,"label":"Lighting","group":"Lighting"},"uvMode":{"default":"stretch","type":"select","options":[{"label":"Stretch","value":"stretch"},{"label":"Mirror","value":"mirror"},{"label":"Wrap","value":"wrap"}],"label":"UV Edges","group":"Scene"},"speed":{"default":1,"type":"range","min":-10,"max":10,"step":0.1,"label":"Speed","group":"Animation","hidden":true}},"preview":"/shader-previews/shader-effects-form3-d.webp"},{"category":"Distortions","description":"Drapes child content over a 3D wave surface with perspective and lighting","id":"shader-effects-surface3-d","name":"Surface3 D","nativeControls":{"amplitude":{"default":0.3,"type":"range","min":0,"max":1,"step":0.01,"label":"Amplitude","group":"Waves"},"waveType":{"default":"fractal","type":"select","options":[{"label":"Fractal","value":"fractal"},{"label":"Sine","value":"sine"},{"label":"Ridge","value":"ridge"}],"label":"Wave Type","group":"Waves"},"frequency":{"default":1.5,"type":"range","min":0.1,"max":5,"step":0.1,"label":"Frequency","group":"Waves"},"octaves":{"default":2,"type":"range","min":1,"max":5,"step":1,"label":"Octaves","group":"Waves"},"seed":{"default":0,"type":"range","min":0,"max":100,"step":1,"label":"Seed","group":"Waves"},"speed":{"default":0.5,"type":"range","min":0,"max":3,"step":0.1,"label":"Speed","group":"Waves","hidden":true},"tilt":{"default":35,"type":"range","min":0,"max":85,"step":1,"label":"Tilt","group":"Camera"},"roll":{"default":0,"type":"range","min":-45,"max":45,"step":1,"label":"Roll","group":"Camera"},"height":{"default":0,"type":"range","min":-1,"max":2,"step":0.01,"label":"Height","group":"Camera"},"zoom":{"default":1,"type":"range","min":0.3,"max":3,"step":0.01,"label":"Zoom","group":"Camera"},"nearCutoff":{"default":0,"type":"range","min":0,"max":1,"step":0.01,"label":"Near Cutoff","group":"Camera"},"farCutoff":{"default":1,"type":"range","min":0,"max":1,"step":0.01,"label":"Far Cutoff","group":"Camera"},"edgePinning":{"default":0,"type":"range","min":0,"max":1,"step":0.01,"label":"Edge Pinning","group":"Waves"},"edges":{"default":"mirror","type":"select","options":[{"label":"Stretch","value":"stretch"},{"label":"Transparent","value":"transparent"},{"label":"Mirror","value":"mirror"},{"label":"Wrap","value":"wrap"}],"label":"Edges","group":"Waves"},"lighting":{"default":30,"type":"range","min":0,"max":100,"step":1,"label":"Lighting","group":"Lighting"},"glossiness":{"default":0,"type":"range","min":0,"max":100,"step":1,"label":"Glossiness","group":"Lighting"},"highlights":{"default":15,"type":"range","min":0,"max":100,"step":1,"label":"Highlights","group":"Lighting"},"lightX":{"default":0.4,"type":"range","min":-1,"max":1,"step":0.01,"label":"Light X","group":"Lighting"},"lightY":{"default":-0.6,"type":"range","min":-1,"max":1,"step":0.01,"label":"Light Y","group":"Lighting"},"lightZ":{"default":0.7,"type":"range","min":-1,"max":1,"step":0.01,"label":"Light Z","group":"Lighting"},"lightColor":{"default":"#ffffff","type":"color","label":"Light Color","group":"Lighting","palette":"highlight"},"cursorIntensity":{"default":1,"type":"range","min":0,"max":2,"step":0.01,"label":"Cursor Ripples","group":"Interaction"},"cursorSpeed":{"default":0.5,"type":"range","min":0,"max":1,"step":0.01,"label":"Ripple Speed","group":"Interaction"}},"preview":"/shader-previews/shader-effects-surface3-d.webp"},{"category":"Stylize","description":"Draw topographical contour lines based on luminance or alpha","id":"shader-effects-contour-lines","name":"Contour Lines","nativeControls":{"levels":{"default":5,"type":["range","map"],"min":2,"max":30,"step":1,"label":"Levels","group":"Effect"},"lineWidth":{"default":2,"type":["range","map"],"min":0.5,"max":5,"step":0.1,"label":"Line Width","group":"Effect"},"softness":{"default":0,"type":"range","min":0,"max":1,"step":0.01,"label":"Softness","group":"Effect"},"gamma":{"default":0.5,"type":["range","map"],"min":0.1,"max":2,"step":0.01,"label":"Gamma","group":"Effect"},"invert":{"default":false,"type":"checkbox","label":"Invert","group":"Effect"},"source":{"default":"luminance","type":"select","options":[{"label":"Luminance","value":"luminance"},{"label":"Alpha","value":"alpha"}],"label":"Source","group":"Effect"},"colorMode":{"default":"source","type":"select","options":[{"label":"Source","value":"source"},{"label":"Custom","value":"custom"}],"label":"Color Mode","group":"Colors"},"lineColor":{"default":"#000000","type":"color","label":"Line Color","group":"Colors","condition":{"colorMode":"custom"},"palette":"main"},"backgroundColor":{"default":"#00000000","type":"color","label":"Background Color","group":"Colors","condition":{"colorMode":"custom"},"palette":"base"}},"preview":"/shader-previews/shader-effects-contour-lines.webp"},{"category":"Stylize","description":"Soft glow effect with adjustable intensity","id":"shader-effects-glow","name":"Glow","nativeControls":{"intensity":{"default":1,"type":["range","map"],"min":0,"max":50,"step":0.5,"label":"Intensity","group":"Effect"},"threshold":{"default":0.5,"type":["range","map"],"min":0,"max":1,"step":0.01,"label":"Threshold","group":"Effect"},"size":{"default":25,"type":["range","map"],"min":0,"max":100,"step":1,"label":"Glow Size","group":"Effect"}},"preview":"/shader-previews/shader-effects-glow.webp"},{"category":"Stylize","description":"Twinkling star glints over the bright parts of the layer inside","id":"shader-effects-sparkle","name":"Sparkle","nativeControls":{"size":{"default":100,"type":["range","map"],"min":10,"max":200,"step":1,"label":"Spacing","group":"Effect"},"intensity":{"default":10,"type":["range","map"],"min":0,"max":20,"step":0.1,"label":"Intensity","group":"Effect"},"threshold":{"default":0.2,"type":["range","map"],"min":0,"max":1,"step":0.01,"label":"Threshold","group":"Effect"},"expand":{"default":0,"type":["range","map"],"min":0,"max":100,"step":1,"label":"Expand","group":"Effect"},"rayLength":{"default":5,"type":["range","map"],"min":0,"max":20,"step":0.1,"label":"Ray Length","group":"Effect"},"colorize":{"default":0.45,"type":["range","map"],"min":0,"max":1,"step":0.01,"label":"Colorize","group":"Effect"},"speed":{"default":1,"type":"range","min":0,"max":5,"step":0.05,"label":"Speed","group":"Animation","hidden":true},"seed":{"default":0,"type":"range","min":0,"max":100,"step":1,"label":"Seed","group":"Animation"}},"preview":"/shader-previews/shader-effects-sparkle.webp"},{"category":"Stylize","description":"Separate RGB channels for a prismatic distortion effect","id":"shader-effects-chromatic-aberration","name":"Chromatic Aberration","nativeControls":{"strength":{"default":0.2,"type":["range","map"],"min":0,"max":1,"step":0.01,"label":"Strength","group":"Effect"},"angle":{"default":0,"type":["range","map"],"min":0,"max":360,"step":1,"label":"Angle","group":"Effect"},"redOffset":{"default":-1,"type":["range","map"],"min":-2,"max":2,"step":0.1,"label":"Red Offset","group":"Effect"},"greenOffset":{"default":0,"type":["range","map"],"min":-2,"max":2,"step":0.1,"label":"Green Offset","group":"Effect"},"blueOffset":{"default":1,"type":["range","map"],"min":-2,"max":2,"step":0.1,"label":"Blue Offset","group":"Effect"}},"preview":"/shader-previews/shader-effects-chromatic-aberration.webp"},{"category":"Stylize","description":"Split content into shifting chromatic layers with barrel or pincushion lens warp. Powered by Paper Shaders.","id":"shader-effects-lens-distortion","name":"Lens Distortion","nativeControls":{"center":{"default":{"x":0.5,"y":0.5},"type":"position","label":"Center","group":"Position"},"spread":{"default":0.6,"type":["range","map"],"min":0,"max":1,"step":0.01,"label":"Spread","group":"Spread"},"angle":{"default":0,"type":["range","map"],"min":0,"max":360,"step":1,"label":"Angle","group":"Spread"},"perspective":{"default":0.1,"type":["range","map"],"min":0,"max":1,"step":0.01,"label":"Perspective","group":"Spread"},"bias":{"default":1,"type":["range","map"],"min":-1,"max":1,"step":0.01,"label":"Bias","group":"Spread"},"count":{"default":35,"type":["range","map"],"min":2,"max":50,"step":1,"label":"Count","group":"Spread"},"dispersion":{"default":1,"type":["range","map"],"min":0,"max":1,"step":0.01,"label":"Dispersion","group":"Dispersion"},"dispersionShift":{"default":0,"type":["range","map"],"min":-1,"max":1,"step":0.01,"label":"Shift","group":"Dispersion"},"dispersionColor":{"default":0.6,"type":["range","map"],"min":0,"max":1,"step":0.01,"label":"Hue","group":"Dispersion"},"focusCenter":{"default":0.8,"type":["range","map"],"min":0,"max":1,"step":0.01,"label":"Focus Center","group":"Focus"},"focusEdges":{"default":1,"type":["range","map"],"min":0,"max":1,"step":0.01,"label":"Focus Edges","group":"Focus"},"lensBulge":{"default":0,"type":["range","map"],"min":-1,"max":1,"step":0.01,"label":"Bulge","group":"Lens"},"lensCircle":{"default":0,"type":["range","map"],"min":0,"max":1,"step":0.01,"label":"Circle","group":"Lens"},"swirl":{"default":0.35,"type":["range","map"],"min":-1,"max":1,"step":0.01,"label":"Swirl","group":"Lens"},"noise":{"default":0,"type":["range","map"],"min":0,"max":1,"step":0.01,"label":"Noise","group":"Noise"},"noiseFrequency":{"default":0.25,"type":["range","map"],"min":0,"max":1,"step":0.01,"label":"Frequency","group":"Noise"},"noiseOffset":{"default":0,"type":["range","map"],"min":0,"max":1,"step":0.01,"label":"Seed","group":"Noise"},"grainMixer":{"default":0,"type":["range","map"],"min":0,"max":1,"step":0.01,"label":"Grain Mixer","group":"Grain"},"grainOverlay":{"default":0,"type":["range","map"],"min":0,"max":1,"step":0.01,"label":"Grain Overlay","group":"Grain"}},"preview":"/shader-previews/shader-effects-lens-distortion.webp"},{"category":"Interactive","description":"Broken glass effect with tectonic plate displacement","id":"shader-effects-shatter","name":"Shatter","nativeControls":{"crackWidth":{"default":1,"type":["range","map"],"min":0.5,"max":5,"step":0.1,"label":"Crack Width","group":"Effect"},"intensity":{"default":4,"type":"range","min":0,"max":20,"step":1,"label":"Intensity","group":"Effect"},"radius":{"default":0.4,"type":"range","min":0.1,"max":1,"step":0.1,"label":"Radius","group":"Effect"},"decay":{"default":1,"type":"range","min":0.1,"max":10,"step":0.1,"label":"Decay","group":"Effect"},"seed":{"default":2,"type":"range","min":0,"max":50,"step":1,"label":"Seed","group":"Effect"},"chromaticSplit":{"default":1,"type":["range","map"],"min":0,"max":5,"step":0.1,"label":"Chromatic Split","group":"Effect"},"refractionStrength":{"default":5,"type":["range","map"],"min":0,"max":10,"step":0.1,"label":"Refraction","group":"Effect"},"shardLighting":{"default":0.1,"type":"range","min":0,"max":0.5,"step":0.1,"label":"Shard Lighting","group":"Effect"},"edges":{"default":"mirror","type":"select","options":[{"label":"Stretch","value":"stretch"},{"label":"Transparent","value":"transparent"},{"label":"Mirror","value":"mirror"},{"label":"Wrap","value":"wrap"}],"label":"Edges","group":"Effect"}},"preview":"/shader-previews/shader-effects-shatter.webp"},{"category":"Interactive","description":"Pixels sort by brightness around the cursor and keep their sorted position, optionally decaying back over time","id":"shader-effects-pixel-sort","name":"Pixel Sort","nativeControls":{"radius":{"default":0.4,"type":["range","map"],"min":0.03,"max":0.6,"step":0.01,"label":"Radius","group":"Effect"},"falloff":{"default":1,"type":["range","map"],"min":0,"max":1,"step":0.01,"label":"Falloff","group":"Effect"},"strength":{"default":0.1,"type":["range","map"],"min":0,"max":1,"step":0.01,"label":"Strength","group":"Effect"},"decay":{"default":0.1,"type":["range","map"],"min":0,"max":1,"step":0.01,"label":"Decay","group":"Effect"},"axis":{"default":"vertical","type":"select","options":[{"label":"Horizontal","value":"horizontal"},{"label":"Vertical","value":"vertical"}],"label":"Axis","group":"Effect"},"direction":{"default":"descending","type":"select","options":[{"label":"Dark → Light","value":"ascending"},{"label":"Light → Dark","value":"descending"}],"label":"Direction","group":"Effect"}},"preview":"/shader-previews/shader-effects-pixel-sort.webp"},{"category":"Interactive","description":"Fluid-like ripple distortion","id":"shader-effects-cursor-ripples","name":"Cursor Ripples","nativeControls":{"intensity":{"default":10,"type":["range","map"],"min":0,"max":20,"step":0.1,"label":"Intensity","group":"Effect"},"decay":{"default":10,"type":"range","min":0,"max":20,"step":0.1,"label":"Decay","group":"Effect"},"radius":{"default":0.5,"type":"range","min":0.1,"max":1,"step":0.1,"label":"Radius","group":"Effect"},"chromaticSplit":{"default":1,"type":["range","map"],"min":0,"max":3,"step":0.1,"label":"Chromatic Split","group":"Effect"},"edges":{"default":"stretch","type":"select","options":[{"label":"Stretch","value":"stretch"},{"label":"Transparent","value":"transparent"},{"label":"Mirror","value":"mirror"},{"label":"Wrap","value":"wrap"}],"label":"Edges","group":"Effect"}},"preview":"/shader-previews/shader-effects-cursor-ripples.webp"},{"category":"Stylize","description":"Corrupted-codec motion smearing — macroblocks lock in place and drag their pixels across the frame in liquid trails, each recovering on its own clock, like a video stream that lost its keyframes","id":"shader-effects-data-mosh","name":"Data Mosh","nativeControls":{"intensity":{"default":0.7,"type":["range","map"],"min":0,"max":1,"step":0.01,"label":"Intensity","group":"Mosh"},"blockSize":{"default":48,"type":"range","min":30,"max":150,"step":1,"label":"Block Size","group":"Mosh"},"drift":{"default":0.35,"type":["range","map"],"min":0,"max":1,"step":0.01,"label":"Drift","group":"Mosh"},"churn":{"default":0.4,"type":["range","map"],"min":0,"max":1,"step":0.01,"label":"Churn","group":"Mosh"},"blend":{"default":1,"type":["range","map"],"min":0,"max":1,"step":0.01,"label":"Blend","group":"Mosh"},"speed":{"default":1,"type":"range","min":0,"max":4,"step":0.1,"label":"Speed","group":"Animation","hidden":true},"seed":{"default":0,"type":["range","map"],"min":0,"max":100,"step":1,"label":"Seed","group":"Animation"}},"preview":"/shader-previews/shader-effects-data-mosh.webp"},{"category":"Stylize","description":"Applies realistic paper grain and surface roughness to child content","id":"shader-effects-paper","name":"Paper","nativeControls":{"roughness":{"default":0.3,"type":"range","min":0,"max":1,"step":0.01,"label":"Roughness","group":"Texture"},"grainScale":{"default":1,"type":"range","min":0.1,"max":3,"step":0.01,"label":"Grain Scale","group":"Texture"},"displacement":{"default":0.15,"type":"range","min":0,"max":1,"step":0.01,"label":"Displacement","group":"Texture"},"seed":{"default":0,"type":"range","min":0,"max":100,"step":1,"label":"Seed","group":"Texture"}},"preview":"/shader-previews/shader-effects-paper.webp"},{"category":"Stylize","description":"Applies a marbled stone relief and surface distortion to child content","id":"shader-effects-stone","name":"Stone","nativeControls":{"intensity":{"default":0.5,"type":"range","min":0,"max":1,"step":0.01,"label":"Intensity","group":"Texture"},"scale":{"default":1,"type":"range","min":0.1,"max":8,"step":0.05,"label":"Scale","group":"Texture"},"contrast":{"default":0,"type":"range","min":-1,"max":2,"step":0.05,"label":"Contrast","group":"Texture"},"distortion":{"default":0.15,"type":"range","min":0,"max":1,"step":0.01,"label":"Distortion","group":"Texture"},"seed":{"default":0,"type":"range","min":0,"max":100,"step":1,"label":"Seed","group":"Texture"}},"preview":"/shader-previews/shader-effects-stone.webp"},{"category":"Stylize","description":"Applies an interwoven fibrous fabric texture and distortion to child content","id":"shader-effects-wool","name":"Wool","nativeControls":{"intensity":{"default":0.5,"type":"range","min":0,"max":1,"step":0.01,"label":"Intensity","group":"Texture"},"scale":{"default":4,"type":"range","min":0.1,"max":8,"step":0.05,"label":"Scale","group":"Texture"},"contrast":{"default":-0.5,"type":"range","min":-1,"max":2,"step":0.05,"label":"Contrast","group":"Texture"},"distortion":{"default":0.15,"type":"range","min":0,"max":1,"step":0.01,"label":"Distortion","group":"Texture"},"seed":{"default":0,"type":"range","min":0,"max":100,"step":1,"label":"Seed","group":"Texture"}},"preview":"/shader-previews/shader-effects-wool.webp"},{"category":"Stylize","description":"Pixelation effect with adjustable cell size","id":"shader-effects-pixelate","name":"Pixelate","nativeControls":{"scale":{"default":50,"type":["range","map"],"min":1,"max":200,"step":1,"label":"Scale","group":"Effect"},"gap":{"default":0,"type":["range","map"],"min":0,"max":0.95,"step":0.01,"label":"Gap","group":"Effect"},"roundness":{"default":0,"type":["range","map"],"min":0,"max":1,"step":0.01,"label":"Roundness","group":"Effect"}},"preview":"/shader-previews/shader-effects-pixelate.webp"},{"category":"Distortions","description":"Map content onto a 3D sphere surface with depth distortion","id":"shader-effects-spherize","name":"Spherize","nativeControls":{"radius":{"default":1,"type":["range","map"],"min":0.1,"max":3,"step":0.1,"label":"Radius","group":"Effect"},"depth":{"default":1,"type":["range","map"],"min":0,"max":3,"step":0.1,"label":"Depth","group":"Effect"},"center":{"default":{"x":0.5,"y":0.5},"type":"position","label":"Center","group":"Position"},"lightPosition":{"default":{"x":0.3,"y":0.3},"type":"position","label":"Light Position","group":"Position"},"lightIntensity":{"default":0.5,"type":["range","map"],"min":0,"max":1,"step":0.1,"label":"Light Intensity","group":"Effect"},"lightSoftness":{"default":0.5,"type":["range","map"],"min":0,"max":1,"step":0.1,"label":"Light Softness","group":"Effect"},"lightColor":{"default":"#ffffff","type":"color","label":"Light Color","group":"Effect","palette":"highlight"}},"preview":"/shader-previews/shader-effects-spherize.webp"},{"category":"Distortions","description":"Rotate and twist content around a center point","id":"shader-effects-twirl","name":"Twirl","nativeControls":{"center":{"default":{"x":0.5,"y":0.5},"type":"position","label":"Center","group":"Position"},"intensity":{"default":1,"type":["range","map"],"min":-5,"max":5,"step":0.1,"label":"Intensity","group":"Effect"},"edges":{"default":"stretch","type":"select","options":[{"label":"Stretch","value":"stretch"},{"label":"Transparent","value":"transparent"},{"label":"Mirror","value":"mirror"},{"label":"Wrap","value":"wrap"}],"label":"Edges","group":"Effect"}},"preview":"/shader-previews/shader-effects-twirl.webp"},{"category":"Distortions","description":"Wave-based distortion with multiple waveform types","id":"shader-effects-wave-distortion","name":"Wave Distortion","nativeControls":{"strength":{"default":0.3,"type":["range","map"],"min":0,"max":1,"step":0.01,"label":"Strength","group":"Effect"},"frequency":{"default":1,"type":["range","map"],"min":0.1,"max":10,"step":0.1,"label":"Frequency","group":"Effect"},"speed":{"default":1,"type":"range","min":0,"max":5,"step":0.1,"label":"Speed","group":"Animation","hidden":true},"angle":{"default":0,"type":["range","map"],"min":0,"max":360,"step":1,"label":"Angle","group":"Effect"},"waveType":{"default":"sine","type":"select","options":[{"label":"Sine","value":"sine"},{"label":"Triangle","value":"triangle"},{"label":"Square","value":"square"},{"label":"Sawtooth","value":"sawtooth"},{"label":"Bounce","value":"bounce"}],"label":"Wave Type","group":"Effect"},"edges":{"default":"stretch","type":"select","options":[{"label":"Stretch","value":"stretch"},{"label":"Transparent","value":"transparent"},{"label":"Mirror","value":"mirror"},{"label":"Wrap","value":"wrap"}],"label":"Edges","group":"Effect"}},"preview":"/shader-previews/shader-effects-wave-distortion.webp"},{"category":"Distortions","description":"Fluid-like distortion with constant smooth motion","id":"shader-effects-flow-field","name":"Flow Field","nativeControls":{"strength":{"default":0.15,"type":["range","map"],"min":0,"max":0.5,"step":0.01,"label":"Strength","group":"Effect"},"detail":{"default":2,"type":["range","map"],"min":0.5,"max":5,"step":0.1,"label":"Detail","group":"Effect"},"speed":{"default":0.5,"type":"range","min":0,"max":20,"step":0.1,"label":"Speed","group":"Animation","hidden":true},"evolutionSpeed":{"default":0,"type":"range","min":0,"max":20,"step":0.1,"label":"Evolution Speed","group":"Animation"},"seed":{"default":0,"type":["range","map"],"min":0,"max":100,"step":1,"label":"Seed","group":"Effect"},"edges":{"default":"mirror","type":"select","options":[{"label":"Stretch","value":"stretch"},{"label":"Transparent","value":"transparent"},{"label":"Mirror","value":"mirror"},{"label":"Wrap","value":"wrap"}],"label":"Edges","group":"Effect"}},"preview":"/shader-previews/shader-effects-flow-field.webp"},{"category":"Distortions","description":"Magnify or pinch content around a center point","id":"shader-effects-bulge","name":"Bulge","nativeControls":{"center":{"default":{"x":0.5,"y":0.5},"type":"position","label":"Center","group":"Position"},"strength":{"default":1,"type":["range","map"],"min":-1,"max":1,"step":0.01,"label":"Strength","group":"Effect"},"radius":{"default":1,"type":["range","map"],"min":0,"max":5,"step":0.1,"label":"Radius","group":"Effect"},"falloff":{"default":0.5,"type":["range","map"],"min":0,"max":1,"step":0.01,"label":"Falloff","group":"Effect"},"edges":{"default":"stretch","type":"select","options":[{"label":"Stretch","value":"stretch"},{"label":"Transparent","value":"transparent"},{"label":"Mirror","value":"mirror"},{"label":"Wrap","value":"wrap"}],"label":"Edges","group":"Effect"}},"preview":"/shader-previews/shader-effects-bulge.webp"},{"category":"Distortions","description":"Concentric rings that each rotate the underlying image by different amounts","id":"shader-effects-concentric-spin","name":"Concentric Spin","nativeControls":{"intensity":{"default":20,"type":["range","map"],"min":0,"max":100,"step":1,"label":"Intensity","group":"Effect"},"rings":{"default":8,"type":["range","map"],"min":1,"max":30,"step":1,"label":"Rings","group":"Effect"},"smoothness":{"default":0.03,"type":["range","map"],"min":0,"max":1,"step":0.01,"label":"Smoothness","group":"Effect"},"seed":{"default":0,"type":"range","min":0,"max":100,"step":1,"label":"Seed","group":"Effect"},"speed":{"default":0.1,"type":"range","min":-5,"max":5,"step":0.1,"label":"Speed","group":"Animation","hidden":true},"speedRandomness":{"default":0.5,"type":["range","map"],"min":0,"max":1,"step":0.01,"label":"Speed Randomness","group":"Animation"},"edges":{"default":"mirror","type":"select","options":[{"label":"Stretch","value":"stretch"},{"label":"Transparent","value":"transparent"},{"label":"Mirror","value":"mirror"},{"label":"Wrap","value":"wrap"}],"label":"Edges","group":"Effect"},"center":{"default":{"x":0.5,"y":0.5},"type":"position","label":"Center Position","group":"Position"}},"preview":"/shader-previews/shader-effects-concentric-spin.webp"},{"category":"Distortions","description":"Slices content into parallel bars, each offset independently for a fractured or glitch-like effect","id":"shader-effects-bar-shift","name":"Bar Shift","nativeControls":{"count":{"default":6,"type":["range","map"],"min":1,"max":30,"step":1,"label":"Count","group":"Effect"},"angle":{"default":0,"type":["range","map"],"min":-180,"max":180,"step":1,"label":"Angle","group":"Effect"},"intensity":{"default":0.15,"type":["range","map"],"min":0,"max":1,"step":0.01,"label":"Intensity","group":"Effect"},"seed":{"default":0,"type":"range","min":0,"max":100,"step":1,"label":"Seed","group":"Effect"},"speed":{"default":0.5,"type":"range","min":-2,"max":2,"step":0.1,"label":"Speed","group":"Animation","hidden":true},"edges":{"default":"mirror","type":"select","options":[{"label":"Stretch","value":"stretch"},{"label":"Transparent","value":"transparent"},{"label":"Mirror","value":"mirror"},{"label":"Wrap","value":"wrap"}],"label":"Edges","group":"Effect"}},"preview":"/shader-previews/shader-effects-bar-shift.webp"},{"category":"Distortions","description":"Convert rectangular coordinates to polar space","id":"shader-effects-polar-coordinates","name":"Polar Coordinates","nativeControls":{"center":{"default":{"x":0.5,"y":0.5},"type":"position","label":"Center","group":"Position"},"wrap":{"default":1,"type":["range","map"],"min":0,"max":2,"step":0.1,"label":"Wrap","group":"Effect"},"radius":{"default":1,"type":["range","map"],"min":0,"max":2,"step":0.1,"label":"Radius","group":"Effect"},"intensity":{"default":1,"type":["range","map"],"min":0,"max":1,"step":0.1,"label":"Intensity","group":"Effect"},"edges":{"default":"transparent","type":"select","options":[{"label":"Stretch","value":"stretch"},{"label":"Transparent","value":"transparent"},{"label":"Mirror","value":"mirror"},{"label":"Wrap","value":"wrap"}],"label":"Edges","group":"Effect"}},"preview":"/shader-previews/shader-effects-polar-coordinates.webp"},{"category":"Distortions","description":"Repeat the child content in grid, radial or linear layouts with per-instance variation","id":"shader-effects-repeater","name":"Repeater","nativeControls":{"mode":{"default":"grid","type":"select","options":[{"label":"Grid","value":"grid"},{"label":"Radial","value":"radial"},{"label":"Linear","value":"linear"}],"label":"Mode","group":"Layout"},"cropLeft":{"default":0,"type":["range","map"],"min":0,"max":0.49,"step":0.005,"label":"Crop Left","group":"Source"},"cropRight":{"default":0,"type":["range","map"],"min":0,"max":0.49,"step":0.005,"label":"Crop Right","group":"Source"},"cropTop":{"default":0,"type":["range","map"],"min":0,"max":0.49,"step":0.005,"label":"Crop Top","group":"Source"},"cropBottom":{"default":0,"type":["range","map"],"min":0,"max":0.49,"step":0.005,"label":"Crop Bottom","group":"Source"},"columns":{"default":3,"type":["range","map"],"min":1,"max":12,"step":1,"label":"Columns","group":"Layout","condition":{"mode":"grid"}},"rows":{"default":3,"type":["range","map"],"min":1,"max":12,"step":1,"label":"Rows","group":"Layout","condition":{"mode":"grid"}},"gapX":{"default":0.05,"type":["range","map"],"min":0,"max":0.5,"step":0.005,"label":"Gap X","group":"Layout","condition":{"mode":"grid"},"dimensional":"canvas-width"},"gapY":{"default":0.05,"type":["range","map"],"min":0,"max":0.5,"step":0.005,"label":"Gap Y","group":"Layout","condition":{"mode":"grid"},"dimensional":"canvas-height"},"stagger":{"default":0,"type":["range","map"],"min":0,"max":1,"step":0.01,"label":"Stagger","group":"Layout","condition":{"mode":"grid"}},"flip":{"default":"none","type":"select","options":[{"label":"None","value":"none"},{"label":"Alternate Flip X","value":"alternate-flip-x"},{"label":"Alternate Flip Y","value":"alternate-flip-y"},{"label":"Both","value":"both"}],"label":"Flip","group":"Layout","condition":{"mode":"grid"}},"count":{"default":8,"type":["range","map"],"min":1,"max":64,"step":1,"label":"Count","group":"Layout","condition":{"mode":["radial","linear"]}},"radius":{"default":0.3,"type":["range","map"],"min":0,"max":1,"step":0.005,"label":"Radius","group":"Layout","condition":{"mode":"radial"},"dimensional":"canvas-height"},"startAngle":{"default":0,"type":["range","map"],"min":0,"max":360,"step":1,"label":"Start Angle","group":"Layout","condition":{"mode":"radial"}},"sweep":{"default":360,"type":["range","map"],"min":0,"max":360,"step":1,"label":"Sweep","group":"Layout","condition":{"mode":"radial"}},"faceCenter":{"default":false,"type":"checkbox","label":"Face Center","group":"Layout","condition":{"mode":"radial"}},"direction":{"default":0,"type":["range","map"],"min":0,"max":360,"step":1,"label":"Direction","group":"Layout","condition":{"mode":"linear"}},"spacing":{"default":0.2,"type":["range","map"],"min":0,"max":1,"step":0.005,"label":"Spacing","group":"Layout","condition":{"mode":"linear"},"dimensional":"canvas-height"},"instanceScale":{"default":1,"type":["range","map"],"min":0.5,"max":2,"step":0.005,"label":"Scale","group":"Instances"},"instanceRotation":{"default":0,"type":["range","map"],"min":-180,"max":180,"step":1,"label":"Rotation","group":"Instances"},"instanceOpacity":{"default":1,"type":["range","map"],"min":0,"max":1,"step":0.005,"label":"Opacity","group":"Instances"},"hueShift":{"default":0,"type":["range","map"],"min":0,"max":360,"step":1,"label":"Hue Shift","group":"Instances"},"phase":{"default":0,"type":["range","map"],"min":0,"max":1,"step":0.001,"label":"Phase","group":"Instances"},"zOrder":{"default":"forward","type":"select","options":[{"label":"Forward","value":"forward"},{"label":"Backward","value":"backward"}],"label":"Z-Order","group":"Instances"},"jitterPosition":{"default":0,"type":["range","map"],"min":0,"max":1,"step":0.005,"label":"Position","group":"Jitter"},"jitterRotation":{"default":0,"type":["range","map"],"min":0,"max":1,"step":0.005,"label":"Rotation","group":"Jitter"},"jitterScale":{"default":0,"type":["range","map"],"min":0,"max":1,"step":0.005,"label":"Scale","group":"Jitter"},"jitterOpacity":{"default":0,"type":["range","map"],"min":0,"max":1,"step":0.005,"label":"Opacity","group":"Jitter"},"seed":{"default":0,"type":["range","map"],"min":0,"max":100,"step":1,"label":"Seed","group":"Jitter"}},"preview":"/shader-previews/shader-effects-repeater.webp"},{"category":"Interactive","description":"Interactive grid distortion controlled by mouse position","id":"shader-effects-grid-distortion","name":"Grid Distortion","nativeControls":{"intensity":{"default":1,"type":"range","min":0,"max":5,"step":0.1,"label":"Intensity","group":"Effect"},"decay":{"default":3,"type":"range","min":0,"max":10,"step":0.1,"label":"Decay","group":"Effect"},"radius":{"default":1,"type":"range","min":0,"max":3,"step":0.1,"label":"Radius","group":"Effect"},"gridSize":{"default":20,"type":["range","map"],"min":8,"max":128,"step":1,"label":"Grid Size","group":"Effect"},"edges":{"default":"stretch","type":"select","options":[{"label":"Stretch","value":"stretch"},{"label":"Transparent","value":"transparent"},{"label":"Mirror","value":"mirror"},{"label":"Wrap","value":"wrap"}],"label":"Edges","group":"Effect"}},"preview":"/shader-previews/shader-effects-grid-distortion.webp"},{"category":"Interactive","description":"Liquid-like interactive deformation effect","id":"shader-effects-liquify","name":"Liquify","nativeControls":{"intensity":{"default":10,"type":["range","map"],"min":0,"max":20,"step":0.1,"label":"Intensity","group":"Effect"},"stiffness":{"default":3,"type":"range","min":1,"max":30,"step":0.5,"label":"Stiffness","group":"Effect"},"damping":{"default":3,"type":"range","min":0,"max":10,"step":0.1,"label":"Damping","group":"Effect"},"radius":{"default":1,"type":"range","min":0.1,"max":1.5,"step":0.1,"label":"Radius","group":"Effect"},"edges":{"default":"stretch","type":"select","options":[{"label":"Stretch","value":"stretch"},{"label":"Transparent","value":"transparent"},{"label":"Mirror","value":"mirror"},{"label":"Wrap","value":"wrap"}],"label":"Edges","group":"Effect"}},"preview":"/shader-previews/shader-effects-liquify.webp"},{"category":"Interactive","description":"Throws pixels along the cursor's path like a fluid — brighter (or redder/greener/bluer) pixels are flung farther, then settle back with friction","id":"shader-effects-pixel-throw","name":"Pixel Throw","nativeControls":{"throwKey":{"default":"luminance","type":"select","options":[{"label":"Brightness","value":"luminance"},{"label":"Darkness","value":"darkness"},{"label":"Red","value":"red"},{"label":"Green","value":"green"},{"label":"Blue","value":"blue"}],"label":"Throw By","group":"Effect"},"strength":{"default":0.25,"type":["range","map"],"min":0,"max":1,"step":0.01,"label":"Strength","group":"Effect"},"keyInfluence":{"default":0.8,"type":["range","map"],"min":0,"max":1,"step":0.01,"label":"Key Influence","group":"Effect"},"radius":{"default":0.2,"type":["range","map"],"min":0.02,"max":0.6,"step":0.01,"label":"Radius","group":"Effect"},"friction":{"default":0.3,"type":["range","map"],"min":0,"max":1,"step":0.01,"label":"Friction","group":"Effect"},"momentum":{"default":0.5,"type":["range","map"],"min":0,"max":1,"step":0.01,"label":"Momentum","group":"Effect"},"edges":{"default":"stretch","type":"select","options":[{"label":"Stretch","value":"stretch"},{"label":"Transparent","value":"transparent"},{"label":"Mirror","value":"mirror"},{"label":"Wrap","value":"wrap"}],"label":"Edges","group":"Effect"}},"preview":"/shader-previews/shader-effects-pixel-throw.webp"},{"category":"Stylize","description":"Analog film grain texture overlay, weighted toward darker areas","id":"shader-effects-film-grain","name":"Film Grain","nativeControls":{"strength":{"default":0.5,"type":["range","map"],"min":0,"max":1,"step":0.025,"label":"Strength","group":"Effect"},"bias":{"default":2,"type":"range","min":0,"max":10,"step":0.1,"label":"Bias","group":"Effect"},"animated":{"default":false,"type":"checkbox","label":"Animated","group":"Effect"}},"preview":"/shader-previews/shader-effects-film-grain.webp"},{"category":"Stylize","description":"Simulates lossy JPEG compression — 8×8 DCT block quantization, blockiness, ringing and color bleed","id":"shader-effects-compression-artifacts","name":"Compression Artifacts","nativeControls":{"quality":{"default":12,"type":["range","map"],"min":1,"max":100,"step":1,"label":"Quality","group":"Effect"}},"preview":"/shader-previews/shader-effects-compression-artifacts.webp"},{"category":"Stylize","description":"Reflective floor that mirrors the content above it","id":"shader-effects-reflective-plane","name":"Reflective Plane","nativeControls":{"height":{"default":0.7,"type":["range","map"],"min":0,"max":1,"step":0.01,"label":"Floor Height","group":"Plane"},"distance":{"default":0.5,"type":["range","map"],"min":0.01,"max":1,"step":0.01,"label":"Reflection Distance","group":"Plane"},"falloff":{"default":0.5,"type":["range","map"],"min":0,"max":3,"step":0.01,"label":"Reflection Falloff","group":"Plane"},"blur":{"default":3,"type":["range","map"],"min":0,"max":5,"step":0.01,"label":"Blur","group":"Surface"},"blurDistance":{"default":0.3,"type":"range","min":0.01,"max":1,"step":0.01,"label":"Blur Distance","group":"Surface"},"edges":{"default":"stretch","type":"select","options":[{"label":"Stretch","value":"stretch"},{"label":"Transparent","value":"transparent"},{"label":"Mirror","value":"mirror"},{"label":"Wrap","value":"wrap"}],"label":"Edges","group":"Surface"}},"preview":"/shader-previews/shader-effects-reflective-plane.webp"},{"category":"Blurs","description":"Photographic lens blur where bright highlights bloom into aperture-shaped discs","id":"shader-effects-bokeh-blur","name":"Bokeh Blur","nativeControls":{"radius":{"default":50,"type":["range","map"],"min":0,"max":100,"step":1,"label":"Radius","group":"Effect"},"highlightGain":{"default":4,"type":["range","map"],"min":0,"max":10,"step":0.1,"label":"Highlight Bloom","group":"Highlights"},"highlightThreshold":{"default":0.6,"type":["range","map"],"min":0,"max":1,"step":0.01,"label":"Highlight Threshold","group":"Highlights"},"bladeShape":{"default":"blades","type":"select","options":[{"label":"Blades","value":"blades"},{"label":"Circle","value":"circle"},{"label":"Star","value":"star"},{"label":"Heart","value":"heart"},{"label":"Flower","value":"flower"},{"label":"Cross","value":"cross"},{"label":"Ring","value":"ring"}],"label":"Blade Shape","group":"Aperture"},"bladeCount":{"default":6,"type":"range","min":0,"max":9,"step":1,"label":"Aperture Blades","group":"Aperture"},"bladeRotation":{"default":0,"type":["range","map"],"min":0,"max":360,"step":1,"label":"Blade Rotation","group":"Aperture"},"chromaticFringe":{"default":0.2,"type":["range","map"],"min":0,"max":1,"step":0.01,"label":"Chromatic Fringe","group":"Aperture"}},"preview":"/shader-previews/shader-effects-bokeh-blur.webp"},{"category":"Blurs","description":"Blur that increases progressively in one direction","id":"shader-effects-progressive-blur","name":"Progressive Blur","nativeControls":{"intensity":{"default":50,"type":["range","map"],"min":0,"max":100,"step":1,"label":"Intensity","group":"Effect"},"angle":{"default":0,"type":["range","map"],"min":0,"max":360,"step":1,"label":"Angle","group":"Effect"},"center":{"default":{"x":0,"y":0.5},"type":"position","label":"Center","group":"Position"},"falloff":{"default":1,"type":["range","map"],"min":0,"max":1,"step":0.1,"label":"Falloff","group":"Effect"}},"preview":"/shader-previews/shader-effects-progressive-blur.webp"},{"category":"Blurs","description":"Selective focus blur mimicking tilt-shift photography","id":"shader-effects-tilt-shift","name":"Tilt Shift","nativeControls":{"intensity":{"default":50,"type":["range","map"],"min":0,"max":100,"step":1,"label":"Intensity","group":"Effect"},"width":{"default":0.3,"type":["range","map"],"min":0,"max":1,"step":0.1,"label":"Width","group":"Effect"},"falloff":{"default":0.3,"type":["range","map"],"min":0,"max":1,"step":0.1,"label":"Falloff","group":"Effect"},"angle":{"default":0,"type":["range","map"],"min":0,"max":360,"step":1,"label":"Angle","group":"Effect"},"center":{"default":{"x":0.5,"y":0.5},"type":"position","label":"Center","group":"Position"}},"preview":"/shader-previews/shader-effects-tilt-shift.webp"},{"category":"Blurs","description":"Radial zoom blur expanding from a center point","id":"shader-effects-zoom-blur","name":"Zoom Blur","nativeControls":{"intensity":{"default":30,"type":["range","map"],"min":0,"max":100,"step":1,"label":"Intensity","group":"Effect"},"center":{"default":{"x":0.5,"y":0.5},"type":"position","label":"Center","group":"Position"}},"preview":"/shader-previews/shader-effects-zoom-blur.webp"},{"category":"Blurs","description":"Radial motion blur rotating around a center point","id":"shader-effects-angular-blur","name":"Angular Blur","nativeControls":{"intensity":{"default":20,"type":["range","map"],"min":0,"max":100,"step":1,"label":"Blur Intensity","group":"Effect"},"center":{"default":{"x":0.5,"y":0.5},"type":"position","label":"Center Position","group":"Position"}},"preview":"/shader-previews/shader-effects-angular-blur.webp"},{"category":"Blurs","description":"Independent blur for red, green, and blue channels","id":"shader-effects-channel-blur","name":"Channel Blur","nativeControls":{"redIntensity":{"default":0,"type":["range","map"],"min":0,"max":100,"step":1,"label":"Red Intensity","group":"Effect"},"greenIntensity":{"default":20,"type":["range","map"],"min":0,"max":100,"step":1,"label":"Green Intensity","group":"Effect"},"blueIntensity":{"default":40,"type":["range","map"],"min":0,"max":100,"step":1,"label":"Blue Intensity","group":"Effect"}},"preview":"/shader-previews/shader-effects-channel-blur.webp"},{"category":"Blurs","description":"Grain-like pixel displacement at random","id":"shader-effects-diffuse-blur","name":"Diffuse Blur","nativeControls":{"intensity":{"default":30,"type":["range","map"],"min":0,"max":100,"step":1,"label":"Intensity","group":"Effect"},"edges":{"default":"stretch","type":"select","options":[{"label":"Stretch","value":"stretch"},{"label":"Transparent","value":"transparent"},{"label":"Mirror","value":"mirror"},{"label":"Wrap","value":"wrap"}],"label":"Edges","group":"Effect"}},"preview":"/shader-previews/shader-effects-diffuse-blur.webp"},{"category":"Blurs","description":"Directional motion blur in a specific angle","id":"shader-effects-linear-blur","name":"Linear Blur","nativeControls":{"intensity":{"default":30,"type":["range","map"],"min":0,"max":100,"step":1,"label":"Intensity","group":"Effect"},"angle":{"default":0,"type":["range","map"],"min":0,"max":360,"step":1,"label":"Angle","group":"Effect"}},"preview":"/shader-previews/shader-effects-linear-blur.webp"},{"category":"Blurs","description":"A simple Gaussian blur effect","id":"shader-effects-blur","name":"Blur","nativeControls":{"intensity":{"default":50,"type":["range","map"],"min":0,"max":200,"step":1,"label":"Intensity","group":"Effect"}},"preview":"/shader-previews/shader-effects-blur.webp"},{"category":"Stylize","description":"Computer-vision style object detection overlay — draws bounding boxes and labels around detected regions of the content below, with grid, quadtree and mosaic layouts.","id":"shader-effects-object-tracker","name":"Object Tracker","nativeControls":{"detectionMode":{"default":"bright","type":"select","options":[{"label":"Transparency","value":"alpha"},{"label":"Brightness","value":"bright"},{"label":"Darkness","value":"dark"},{"label":"Red","value":"red"},{"label":"Green","value":"green"},{"label":"Blue","value":"blue"}],"label":"Detect","group":"Detection"},"threshold":{"default":0.25,"type":"range","min":0,"max":1,"step":0.01,"label":"Threshold","group":"Detection"},"layout":{"default":"mosaic","type":"select","options":[{"label":"Grid","value":"grid"},{"label":"Quadtree","value":"quadtree"},{"label":"Mosaic","value":"mosaic"}],"label":"Layout","group":"Detection"},"cellSize":{"default":400,"type":"range","min":24,"max":800,"step":1,"label":"Base Cell Size","group":"Detection"},"maxDepth":{"default":2,"type":"range","min":1,"max":5,"step":1,"label":"Subdivision","group":"Detection","condition":{"layout":["quadtree","mosaic"]}},"boxStyle":{"default":"corners","type":"select","options":[{"label":"Full","value":"full"},{"label":"Corners","value":"corners"}],"label":"Box Style","group":"Boxes"},"lineWidth":{"default":1.5,"type":"range","min":0.5,"max":12,"step":0.5,"label":"Line Width","group":"Boxes"},"cornerRadius":{"default":0,"type":"range","min":0,"max":40,"step":1,"label":"Corner Radius","group":"Boxes","condition":{"boxStyle":"full"}},"strokeColor":{"default":"#ffffff","type":"color","label":"Stroke","group":"Colors","palette":"highlight"},"fillColor":{"default":"#5a79911a","type":"color","label":"Fill","group":"Colors","palette":"main"},"labelColor":{"default":"#000000","type":"color","label":"Label","group":"Colors","condition":{"labelMode":["dimensions","percentage"]},"palette":"base"},"labelBackgroundColor":{"default":"#ffffff","type":"color","label":"Label Background","group":"Colors","condition":{"labelMode":["dimensions","percentage"]},"palette":"highlight"},"labelMode":{"default":"none","type":"select","options":[{"label":"None","value":"none"},{"label":"Dimensions","value":"dimensions"},{"label":"Percentage","value":"percentage"}],"label":"Label","group":"Labels"},"labelPosition":{"default":"bottom-right","type":"select","options":[{"label":"Bottom Left","value":"bottom-left"},{"label":"Bottom Right","value":"bottom-right"},{"label":"Top Left","value":"top-left"},{"label":"Top Right","value":"top-right"}],"label":"Label Position","group":"Labels","condition":{"labelMode":["dimensions","percentage"]}},"labelRadius":{"default":0,"type":"range","min":0,"max":30,"step":1,"label":"Border Radius","group":"Labels","condition":{"labelMode":["dimensions","percentage"]}},"labelInset":{"default":true,"type":"checkbox","label":"Label Inset","group":"Labels","condition":{"labelMode":["dimensions","percentage"]}},"fontFamily":{"default":"Inter","type":"font-family","label":"Font","group":"Typography","condition":{"labelMode":["dimensions","percentage"]}},"fontWeight":{"default":500,"type":"font-weight","label":"Weight","group":"Typography","condition":{"labelMode":["dimensions","percentage"]},"max":900,"min":100,"step":100},"fontSize":{"default":0.015,"type":"range","min":0.01,"max":0.5,"step":0.005,"label":"Size","group":"Typography","dimensional":"canvas-height","condition":{"labelMode":["dimensions","percentage"]}},"letterSpacing":{"default":0,"type":"range","min":-0.1,"max":0.5,"step":0.005,"label":"Letter Spacing","group":"Typography","condition":{"labelMode":["dimensions","percentage"]}}},"preview":"/shader-previews/shader-effects-object-tracker.webp"},{"category":"Stylize","description":"Motion-tracking overlay — trackers hunt and follow features in the content, dropping keyframe diamonds behind them along their motion paths, like a compositor mid-track","id":"shader-effects-key-frames","name":"Key Frames","nativeControls":{"trackers":{"default":12,"type":["range","map"],"min":1,"max":64,"step":1,"label":"Trackers","group":"Tracking"},"detect":{"default":"bright","type":"select","options":[{"label":"Brightness","value":"bright"},{"label":"Darkness","value":"dark"},{"label":"Transparency","value":"alpha"},{"label":"Red","value":"red"},{"label":"Green","value":"green"},{"label":"Blue","value":"blue"}],"label":"Detect","group":"Tracking"},"threshold":{"default":0.15,"type":"range","min":0,"max":0.9,"step":0.01,"label":"Threshold","group":"Tracking"},"variance":{"default":0.8,"type":["range","map"],"min":0,"max":1,"step":0.01,"label":"Variance","group":"Tracking"},"agility":{"default":0.5,"type":["range","map"],"min":0,"max":1,"step":0.01,"label":"Agility","group":"Tracking"},"lifespan":{"default":6,"type":["range","map"],"min":0,"max":20,"step":0.5,"label":"Lifespan","group":"Tracking"},"trail":{"default":1,"type":["range","map"],"min":0,"max":1,"step":0.01,"label":"Trail","group":"Style"},"markerSize":{"default":28,"type":"range","min":8,"max":80,"step":1,"label":"Marker Size","group":"Style"},"lineWidth":{"default":1.5,"type":"range","min":0.5,"max":6,"step":0.25,"label":"Line Width","group":"Style"},"markerColor":{"default":"#54d66b","type":"color","label":"Tracker","group":"Colors","palette":"main"},"keyframeColor":{"default":"#ffcf33","type":"color","label":"Keyframes","group":"Colors","palette":"highlight"},"pathColor":{"default":"#ffffffb8","type":"color","label":"Path","group":"Colors","palette":"highlight"}},"preview":"/shader-previews/shader-effects-key-frames.webp"},{"category":"Stylize","description":"An Echo-style temporal trail — whatever moves sheds a smooth, decaying long-exposure ghost trail (frame-difference Motion mode works on opaque images and video; Alpha mode trails a shape's coverage), with optional zoom-feedback tunnels and rainbow light-painting","id":"shader-effects-time-trail","name":"Time Trail","nativeControls":{"trailSource":{"default":"motion","type":"select","options":[{"label":"Motion","value":"motion"},{"label":"Alpha","value":"alpha"}],"label":"Source","group":"Trail"},"motionThreshold":{"default":0.06,"type":["range","map"],"min":0.01,"max":0.5,"step":0.01,"label":"Motion Threshold","group":"Trail"},"trailLength":{"default":0.6,"type":["range","map"],"min":0.05,"max":4,"step":0.01,"label":"Trail Length","group":"Trail"},"diffusion":{"default":1,"type":["range","map"],"min":0,"max":1,"step":0.01,"label":"Diffusion","group":"Trail"},"trailOpacity":{"default":1,"type":["range","map"],"min":0,"max":1,"step":0.01,"label":"Trail Opacity","group":"Trail"},"trailBlend":{"default":"normal","type":"select","options":[{"label":"Normal","value":"normal"},{"label":"Add","value":"add"},{"label":"Screen","value":"screen"},{"label":"Multiply","value":"multiply"},{"label":"Overlay","value":"overlay"},{"label":"Soft Light","value":"softLight"},{"label":"Hard Light","value":"hardLight"},{"label":"Darken","value":"darken"},{"label":"Lighten","value":"lighten"},{"label":"Color Dodge","value":"colorDodge"},{"label":"Color Burn","value":"colorBurn"},{"label":"Linear Burn","value":"linearBurn"},{"label":"Difference","value":"difference"},{"label":"Exclusion","value":"exclusion"},{"label":"Hue","value":"hue"},{"label":"Saturation","value":"saturation"},{"label":"Color","value":"color"},{"label":"Luminosity","value":"luminosity"}],"label":"Blend","group":"Trail"},"driftX":{"default":0,"type":["range","map"],"min":-1,"max":1,"step":0.01,"label":"Drift X","group":"Feedback"},"driftY":{"default":0,"type":["range","map"],"min":-1,"max":1,"step":0.01,"label":"Drift Y","group":"Feedback"},"zoom":{"default":1,"type":["range","map"],"min":0.9,"max":1.1,"step":0.001,"label":"Zoom","group":"Feedback"},"tintMode":{"default":"none","type":"select","options":[{"label":"None","value":"none"},{"label":"Color","value":"color"},{"label":"Rainbow","value":"rainbow"}],"label":"Tint Mode","group":"Color"},"tint":{"default":"#33aaff","type":"color","label":"Tint","group":"Color","palette":"main"},"speed":{"default":1,"type":"range","min":0,"max":4,"step":0.1,"label":"Speed","group":"Animation","hidden":true}},"preview":"/shader-previews/shader-effects-time-trail.webp"},{"category":"Stylize","description":"Darkens or tints the edges of the frame, drawing attention toward the center","id":"shader-effects-vignette","name":"Vignette","nativeControls":{"color":{"default":"#000000","type":"color","label":"Color","group":"Colors","palette":"base"},"center":{"default":{"x":0.5,"y":0.5},"type":"position","label":"Center","group":"Position"},"radius":{"default":0.5,"type":["range","map"],"min":0,"max":1.5,"step":0.01,"label":"Radius","group":"Effect"},"falloff":{"default":0.5,"type":["range","map"],"min":0.01,"max":1.5,"step":0.01,"label":"Falloff","group":"Effect"},"intensity":{"default":1,"type":["range","map"],"min":0,"max":1,"step":0.01,"label":"Intensity","group":"Effect"}},"preview":"/shader-previews/shader-effects-vignette.webp"},{"category":"Stylize","description":"Adds a soft shadow behind the child content based on its alpha silhouette","id":"shader-effects-drop-shadow","name":"Drop Shadow","nativeControls":{"color":{"default":"#000000","type":"color","label":"Color","group":"Colors","palette":"base"},"distance":{"default":0.1,"type":["range","map"],"min":0,"max":1,"step":0.005,"label":"Distance","group":"Effect"},"angle":{"default":135,"type":["range","map"],"min":0,"max":360,"step":1,"label":"Angle","group":"Effect"},"blur":{"default":5,"type":["range","map"],"min":0,"max":20,"step":0.5,"label":"Blur","group":"Effect"},"intensity":{"default":0.5,"type":["range","map"],"min":0,"max":1,"step":0.01,"label":"Intensity","group":"Effect"},"cutout":{"default":false,"type":"checkbox","label":"Cutout","group":"Effect"}},"preview":"/shader-previews/shader-effects-drop-shadow.webp"},{"category":"Distortions","description":"Distorts child content using another layer's pixels as a displacement map","id":"shader-effects-displacement-map","name":"Displacement Map","nativeControls":{"source":{"default":"","type":"layer","label":"Source Layer","group":"Effect"},"amount":{"default":0.3,"type":["range","map"],"min":0,"max":1,"step":0.01,"label":"Amount","group":"Effect"},"channelMode":{"default":"twoAxis","type":"select","options":[{"label":"Red / Green","value":"twoAxis"},{"label":"Luminance","value":"directional"}],"label":"Channels","group":"Effect"},"angle":{"default":0,"type":["range","map"],"min":0,"max":360,"step":1,"label":"Angle","group":"Effect","condition":{"channelMode":"directional"}},"edges":{"default":"mirror","type":"select","options":[{"label":"Stretch","value":"stretch"},{"label":"Transparent","value":"transparent"},{"label":"Mirror","value":"mirror"},{"label":"Wrap","value":"wrap"}],"label":"Edges","group":"Effect"}},"preview":"/shader-previews/shader-effects-displacement-map.webp"},{"category":"Distortions","description":"Convert polar coordinates back to rectangular space","id":"shader-effects-rectangular-coordinates","name":"Rectangular Coordinates","nativeControls":{"center":{"default":{"x":0.5,"y":0.5},"type":"position","label":"Center","group":"Position"},"scale":{"default":1,"type":["range","map"],"min":0.1,"max":3,"step":0.1,"label":"Scale","group":"Effect"},"intensity":{"default":1,"type":["range","map"],"min":0,"max":1,"step":0.1,"label":"Intensity","group":"Effect"},"edges":{"default":"transparent","type":"select","options":[{"label":"Stretch","value":"stretch"},{"label":"Transparent","value":"transparent"},{"label":"Mirror","value":"mirror"},{"label":"Wrap","value":"wrap"}],"label":"Edges","group":"Effect"}},"preview":"/shader-previews/shader-effects-rectangular-coordinates.webp"},{"category":"Distortions","description":"Mirror content across a line defined by center point and angle","id":"shader-effects-mirror","name":"Mirror","nativeControls":{"center":{"default":{"x":0.5,"y":0.5},"type":"position","label":"Center","group":"Position"},"angle":{"default":0,"type":["range","map"],"min":0,"max":360,"step":1,"label":"Angle","group":"Effect"},"edges":{"default":"mirror","type":"select","options":[{"label":"Stretch","value":"stretch"},{"label":"Transparent","value":"transparent"},{"label":"Mirror","value":"mirror"},{"label":"Wrap","value":"wrap"}],"label":"Edges","group":"Effect"}},"preview":"/shader-previews/shader-effects-mirror.webp"},{"category":"Distortions","description":"Bends the ends of the frame toward you like a curved display — content at the edges swells closer under real perspective, or curls away when the strength goes negative","id":"shader-effects-bend","name":"Bend","nativeControls":{"strength":{"default":0.5,"type":["range","map"],"min":-1,"max":1,"step":0.01,"label":"Strength","group":"Effect"},"falloff":{"default":0,"type":["range","map"],"min":0,"max":1,"step":0.01,"label":"Falloff","group":"Effect"},"angle":{"default":0,"type":["range","map"],"min":0,"max":360,"step":1,"label":"Angle","group":"Effect"},"edges":{"default":"transparent","type":"select","options":[{"label":"Stretch","value":"stretch"},{"label":"Transparent","value":"transparent"},{"label":"Mirror","value":"mirror"},{"label":"Wrap","value":"wrap"}],"label":"Edges","group":"Effect"}},"preview":"/shader-previews/shader-effects-bend.webp"},{"category":"Distortions","description":"Stretch content towards a direction from a center point","id":"shader-effects-stretch","name":"Stretch","nativeControls":{"center":{"default":{"x":0.5,"y":0.5},"type":"position","label":"Center","group":"Position"},"strength":{"default":1,"type":["range","map"],"min":0,"max":1,"step":0.01,"label":"Strength","group":"Effect"},"angle":{"default":0,"type":["range","map"],"min":0,"max":360,"step":1,"label":"Angle","group":"Effect"},"falloff":{"default":0,"type":["range","map"],"min":0,"max":1,"step":0.01,"label":"Falloff","group":"Effect"},"edges":{"default":"stretch","type":"select","options":[{"label":"Stretch","value":"stretch"},{"label":"Transparent","value":"transparent"},{"label":"Mirror","value":"mirror"},{"label":"Wrap","value":"wrap"}],"label":"Edges","group":"Effect"}},"preview":"/shader-previews/shader-effects-stretch.webp"},{"category":"Distortions","description":"Rotate the plane in 3D space with pan and tilt","id":"shader-effects-perspective","name":"Perspective","nativeControls":{"center":{"default":{"x":0.5,"y":0.5},"type":"position","label":"Center","group":"Position"},"pan":{"default":24,"type":["range","map"],"min":-90,"max":90,"step":0.1,"label":"Pan","group":"Effect"},"tilt":{"default":16,"type":["range","map"],"min":-90,"max":90,"step":0.1,"label":"Tilt","group":"Effect"},"fov":{"default":60,"type":["range","map"],"min":30,"max":120,"step":1,"label":"FOV","group":"Effect"},"zoom":{"default":1,"type":["range","map"],"min":0.5,"max":3,"step":0.1,"label":"Zoom","group":"Effect"},"offset":{"default":{"x":0.5,"y":0.5},"type":"position","label":"Offset","group":"Position"},"edges":{"default":"transparent","type":"select","options":[{"label":"Stretch","value":"stretch"},{"label":"Transparent","value":"transparent"},{"label":"Mirror","value":"mirror"},{"label":"Wrap","value":"wrap"}],"label":"Edges","group":"Effect"}},"preview":"/shader-previews/shader-effects-perspective.webp"},{"category":"Distortions","description":"Pin each corner of the content to an arbitrary position for a free perspective warp","id":"shader-effects-corner-pin","name":"Corner Pin","nativeControls":{"topLeft":{"default":{"x":0.08,"y":0.1},"type":"position","label":"Top Left","group":"Corners"},"topRight":{"default":{"x":0.94,"y":0.02},"type":"position","label":"Top Right","group":"Corners"},"bottomLeft":{"default":{"x":0.02,"y":0.96},"type":"position","label":"Bottom Left","group":"Corners"},"bottomRight":{"default":{"x":0.9,"y":0.86},"type":"position","label":"Bottom Right","group":"Corners"},"amount":{"default":1,"type":["range","map"],"min":0,"max":1,"step":0.01,"label":"Amount","group":"Effect"},"edges":{"default":"transparent","type":"select","options":[{"label":"Stretch","value":"stretch"},{"label":"Transparent","value":"transparent"},{"label":"Mirror","value":"mirror"},{"label":"Wrap","value":"wrap"}],"label":"Edges","group":"Effect"}},"preview":"/shader-previews/shader-effects-corner-pin.webp"},{"category":"Transitions","description":"Curl the content up from a corner like a peeling page","id":"shader-effects-page-peel","name":"Page Peel","nativeControls":{"corner":{"default":"bottom-right","type":"select","options":[{"label":"Top Left","value":"top-left"},{"label":"Top Right","value":"top-right"},{"label":"Bottom Left","value":"bottom-left"},{"label":"Bottom Right","value":"bottom-right"}],"label":"Corner","group":"Effect"},"amount":{"default":0.2,"type":["range","map"],"min":0,"max":1,"step":0.01,"label":"Amount","group":"Effect"},"radius":{"default":0.2,"type":["range","map"],"min":0.02,"max":0.4,"step":0.01,"label":"Curl Radius","group":"Effect"},"shading":{"default":0.55,"type":["range","map"],"min":0,"max":1,"step":0.01,"label":"Shading","group":"Effect"},"highlight":{"default":0.4,"type":["range","map"],"min":0,"max":1,"step":0.01,"label":"Highlight","group":"Effect"},"highlightSoftness":{"default":0.2,"type":["range","map"],"min":0,"max":1,"step":0.01,"label":"Highlight Softness","group":"Effect"},"shadow":{"default":1,"type":["range","map"],"min":0,"max":1,"step":0.01,"label":"Shadow","group":"Effect"}},"preview":"/shader-previews/shader-effects-page-peel.webp"},{"category":"Transitions","description":"Wipe the content away in concentric rings pulsing out from a center point","id":"shader-effects-ripple-wipe","name":"Ripple Wipe","nativeControls":{"progress":{"default":0.5,"type":["range","map"],"min":0,"max":1,"step":0.01,"label":"Progress","group":"Transition"},"center":{"default":{"x":0.5,"y":0.5},"type":"position","label":"Center","group":"Position"},"rings":{"default":8,"type":["range","map"],"min":2,"max":40,"step":1,"label":"Rings","group":"Transition"},"feather":{"default":0.2,"type":["range","map"],"min":0,"max":1,"step":0.01,"label":"Feather","group":"Transition"},"invert":{"default":false,"type":"checkbox","label":"Invert","group":"Transition"}},"preview":"/shader-previews/shader-effects-ripple-wipe.webp"},{"category":"Transitions","description":"Dissolve the content away through an organic noise pattern","id":"shader-effects-noise-dissolve","name":"Noise Dissolve","nativeControls":{"progress":{"default":0.5,"type":["range","map"],"min":0,"max":1,"step":0.01,"label":"Progress","group":"Transition"},"scale":{"default":3,"type":["range","map"],"min":0.5,"max":20,"step":0.1,"label":"Scale","group":"Transition"},"softness":{"default":0.25,"type":["range","map"],"min":0,"max":1,"step":0.01,"label":"Softness","group":"Transition"},"seed":{"default":0,"type":["range","map"],"min":0,"max":100,"step":1,"label":"Seed","group":"Transition"},"invert":{"default":false,"type":"checkbox","label":"Invert","group":"Transition"}},"preview":"/shader-previews/shader-effects-noise-dissolve.webp"},{"category":"Transitions","description":"Dissolve the content away as a grid of blocks vanishing in random order","id":"shader-effects-block-dissolve","name":"Block Dissolve","nativeControls":{"progress":{"default":0.5,"type":["range","map"],"min":0,"max":1,"step":0.01,"label":"Progress","group":"Transition"},"blockSize":{"default":0.08,"type":["range","map"],"min":0.01,"max":0.5,"step":0.01,"label":"Block Size","group":"Transition"},"softness":{"default":0.15,"type":["range","map"],"min":0,"max":1,"step":0.01,"label":"Softness","group":"Transition"},"invert":{"default":false,"type":"checkbox","label":"Invert","group":"Transition"}},"preview":"/shader-previews/shader-effects-block-dissolve.webp"},{"category":"Transitions","description":"Wipe the content away through a lattice of growing diamonds","id":"shader-effects-diamond-wipe","name":"Diamond Wipe","nativeControls":{"progress":{"default":0.5,"type":["range","map"],"min":0,"max":1,"step":0.01,"label":"Progress","group":"Transition"},"size":{"default":0.15,"type":["range","map"],"min":0.02,"max":0.5,"step":0.01,"label":"Size","group":"Transition"},"feather":{"default":0.1,"type":["range","map"],"min":0,"max":1,"step":0.01,"label":"Feather","group":"Transition"},"invert":{"default":false,"type":"checkbox","label":"Invert","group":"Transition"}},"preview":"/shader-previews/shader-effects-diamond-wipe.webp"},{"category":"Transitions","description":"Reveal through an expanding circle growing from a center point","id":"shader-effects-iris-wipe","name":"Iris Wipe","nativeControls":{"progress":{"default":0.5,"type":["range","map"],"min":0,"max":1,"step":0.01,"label":"Progress","group":"Transition"},"center":{"default":{"x":0.5,"y":0.5},"type":"position","label":"Center","group":"Position"},"feather":{"default":0.1,"type":["range","map"],"min":0,"max":1,"step":0.01,"label":"Feather","group":"Transition"},"invert":{"default":false,"type":"checkbox","label":"Invert","group":"Transition"}},"preview":"/shader-previews/shader-effects-iris-wipe.webp"},{"category":"Transitions","description":"Sweep the content away in a clock-hand arc around a center point","id":"shader-effects-radial-wipe","name":"Radial Wipe","nativeControls":{"progress":{"default":0.5,"type":["range","map"],"min":0,"max":1,"step":0.01,"label":"Progress","group":"Transition"},"startAngle":{"default":0,"type":["range","map"],"min":0,"max":360,"step":1,"label":"Start Angle","group":"Transition"},"direction":{"default":"cw","type":"select","options":[{"label":"Clockwise","value":"cw"},{"label":"Counter-Clockwise","value":"ccw"},{"label":"Both","value":"both"}],"label":"Direction","group":"Transition"},"center":{"default":{"x":0.5,"y":0.5},"type":"position","label":"Center","group":"Position"},"feather":{"default":0.1,"type":["range","map"],"min":0,"max":1,"step":0.01,"label":"Feather","group":"Transition"},"invert":{"default":false,"type":"checkbox","label":"Invert","group":"Transition"}},"preview":"/shader-previews/shader-effects-radial-wipe.webp"},{"category":"Transitions","description":"Wipe the content away behind a set of parallel closing strips","id":"shader-effects-venetian-blinds","name":"Venetian Blinds","nativeControls":{"progress":{"default":0.5,"type":["range","map"],"min":0,"max":1,"step":0.01,"label":"Progress","group":"Transition"},"angle":{"default":0,"type":["range","map"],"min":0,"max":360,"step":1,"label":"Angle","group":"Transition"},"stripCount":{"default":5,"type":["range","map"],"min":2,"max":60,"step":1,"label":"Strips","group":"Transition"},"feather":{"default":0.15,"type":["range","map"],"min":0,"max":1,"step":0.01,"label":"Feather","group":"Transition"},"invert":{"default":false,"type":"checkbox","label":"Invert","group":"Transition"}},"preview":"/shader-previews/shader-effects-venetian-blinds.webp"},{"category":"Transitions","description":"Slice the content into strips that slide away in alternating directions","id":"shader-effects-slice-wipe","name":"Slice Wipe","nativeControls":{"progress":{"default":0.5,"type":["range","map"],"min":0,"max":1,"step":0.01,"label":"Progress","group":"Transition"},"angle":{"default":0,"type":["range","map"],"min":0,"max":360,"step":1,"label":"Angle","group":"Transition"},"sliceCount":{"default":8,"type":["range","map"],"min":2,"max":60,"step":1,"label":"Slices","group":"Transition"}},"preview":"/shader-previews/shader-effects-slice-wipe.webp"},{"category":"Transitions","description":"Wipe the content away as a checkerboard of fading squares","id":"shader-effects-checker-wipe","name":"Checker Wipe","nativeControls":{"progress":{"default":0.5,"type":["range","map"],"min":0,"max":1,"step":0.01,"label":"Progress","group":"Transition"},"blockSize":{"default":0.1,"type":["range","map"],"min":0.02,"max":0.5,"step":0.01,"label":"Block Size","group":"Transition"},"softness":{"default":0.15,"type":["range","map"],"min":0,"max":1,"step":0.01,"label":"Softness","group":"Transition"},"invert":{"default":false,"type":"checkbox","label":"Invert","group":"Transition"}},"preview":"/shader-previews/shader-effects-checker-wipe.webp"},{"category":"Transitions","description":"Wipe the content away as parallel bars vanishing in random order","id":"shader-effects-random-bars","name":"Random Bars","nativeControls":{"progress":{"default":0.5,"type":["range","map"],"min":0,"max":1,"step":0.01,"label":"Progress","group":"Transition"},"angle":{"default":0,"type":["range","map"],"min":0,"max":360,"step":1,"label":"Angle","group":"Transition"},"barCount":{"default":12,"type":["range","map"],"min":2,"max":100,"step":1,"label":"Bars","group":"Transition"},"softness":{"default":0.15,"type":["range","map"],"min":0,"max":1,"step":0.01,"label":"Softness","group":"Transition"},"invert":{"default":false,"type":"checkbox","label":"Invert","group":"Transition"}},"preview":"/shader-previews/shader-effects-random-bars.webp"},{"category":"Transitions","description":"Split the content along a center line and wipe outward in both directions","id":"shader-effects-barn-doors","name":"Barn Doors","nativeControls":{"progress":{"default":0.5,"type":["range","map"],"min":0,"max":1,"step":0.01,"label":"Progress","group":"Transition"},"angle":{"default":0,"type":["range","map"],"min":0,"max":360,"step":1,"label":"Angle","group":"Transition"},"feather":{"default":0.1,"type":["range","map"],"min":0,"max":1,"step":0.01,"label":"Feather","group":"Transition"},"invert":{"default":false,"type":"checkbox","label":"Invert","group":"Transition"}},"preview":"/shader-previews/shader-effects-barn-doors.webp"},{"category":"Transitions","description":"Wipe the content away along a straight edge with a soft feathered transition","id":"shader-effects-linear-wipe","name":"Linear Wipe","nativeControls":{"progress":{"default":0.5,"type":["range","map"],"min":0,"max":1,"step":0.01,"label":"Progress","group":"Transition"},"angle":{"default":0,"type":["range","map"],"min":0,"max":360,"step":1,"label":"Angle","group":"Transition"},"feather":{"default":0.1,"type":["range","map"],"min":0,"max":1,"step":0.01,"label":"Feather","group":"Transition"},"invert":{"default":false,"type":"checkbox","label":"Invert","group":"Transition"}},"preview":"/shader-previews/shader-effects-linear-wipe.webp"},{"category":"Distortions","description":"Mirror content horizontally, vertically, or both","id":"shader-effects-flip","name":"Flip","nativeControls":{"flipX":{"default":true,"type":"checkbox","label":"Flip X","group":"Effect"},"flipY":{"default":false,"type":"checkbox","label":"Flip Y","group":"Effect"}},"preview":"/shader-previews/shader-effects-flip.webp"},{"category":"Adjustments","description":"Real analog film color from measured film-emulation LUTs — ten classic stock looks with emulsion halation and projector gate weave","id":"shader-effects-film-stock","name":"Film Stock","nativeControls":{"stock":{"default":"portrait400","type":"select","options":[{"label":"Portrait 400","value":"portrait400"},{"label":"Vivid 100","value":"vivid100"},{"label":"Chrome 64","value":"chrome64"},{"label":"Slide 100","value":"slide100"},{"label":"Velvet 50","value":"velvet50"},{"label":"Everyday 400","value":"everyday400"},{"label":"Pastel 400","value":"pastel400"},{"label":"Warm 200","value":"warm200"},{"label":"Instant","value":"instant"},{"label":"Mono 400","value":"mono400"}],"label":"Stock","group":"Stock"},"strength":{"default":1,"type":["range","map"],"min":0,"max":1,"step":0.01,"label":"Strength","group":"Stock"},"halation":{"default":0.4,"type":["range","map"],"min":0,"max":1,"step":0.01,"label":"Halation","group":"Halation"},"halationRadius":{"default":28,"type":"range","min":0,"max":100,"step":1,"label":"Halation Radius","group":"Halation"},"weave":{"default":0,"type":["range","map"],"min":0,"max":1,"step":0.01,"label":"Gate Weave","group":"Weave"}},"preview":"/shader-previews/shader-effects-film-stock.webp"},{"category":"Adjustments","description":"Map colors to two tones based on luminance","id":"shader-effects-duotone","name":"Duotone","nativeControls":{"colorA":{"default":"#ff0000","type":"color","label":"Color A","group":"Colors","palette":"base"},"colorB":{"default":"#023af4","type":"color","label":"Color B","group":"Colors","palette":"highlight"},"blend":{"default":0.5,"type":["range","map"],"min":0,"max":1,"step":0.1,"label":"Blend","group":"Effect"},"colorSpace":{"default":"linear","type":"select","options":[{"label":"Linear RGB","value":"linear"},{"label":"OKLCh","value":"oklch"},{"label":"OKLAB","value":"oklab"},{"label":"HSL","value":"hsl"},{"label":"HSV","value":"hsv"},{"label":"LCH","value":"lch"}],"label":"Color Space","group":"Colors"}},"preview":"/shader-previews/shader-effects-duotone.webp"},{"category":"Adjustments","description":"Map colors to three tones: shadows, midtones, highlights","id":"shader-effects-tritone","name":"Tritone","nativeControls":{"colorA":{"default":"#ce1bea","type":"color","label":"Color A (Shadows)","group":"Colors","palette":"base"},"colorB":{"default":"#2fff00","type":"color","label":"Color B (Midtones)","group":"Colors","palette":"main"},"colorC":{"default":"#ffff00","type":"color","label":"Color C (Highlights)","group":"Colors","palette":"highlight"},"blendMid":{"default":0.5,"type":["range","map"],"min":0,"max":1,"step":0.1,"label":"Midpoint","group":"Effect"},"colorSpace":{"default":"linear","type":"select","options":[{"label":"Linear RGB","value":"linear"},{"label":"OKLCh","value":"oklch"},{"label":"OKLAB","value":"oklab"},{"label":"HSL","value":"hsl"},{"label":"HSV","value":"hsv"},{"label":"LCH","value":"lch"}],"label":"Color Space","group":"Colors"}},"preview":"/shader-previews/shader-effects-tritone.webp"},{"category":"Adjustments","description":"Reduce color depth to create a poster effect","id":"shader-effects-posterize","name":"Posterize","nativeControls":{"intensity":{"default":5,"type":["range","map"],"min":2,"max":20,"step":1,"label":"Intensity","group":"Effect"}},"preview":"/shader-previews/shader-effects-posterize.webp"},{"category":"Adjustments","description":"Inverts tones above a luminance threshold — a classic darkroom and photo effect","id":"shader-effects-solarize","name":"Solarize","nativeControls":{"threshold":{"default":0.35,"type":["range","map"],"min":0,"max":1,"step":0.01,"label":"Threshold","group":"Effect"},"strength":{"default":1,"type":["range","map"],"min":0,"max":1,"step":0.01,"label":"Strength","group":"Effect"}},"preview":"/shader-previews/shader-effects-solarize.webp"},{"category":"Adjustments","description":"Apply a color tint to the image","id":"shader-effects-tint","name":"Tint","nativeControls":{"color":{"default":"#ff8800","type":"color","label":"Tint Color","group":"Colors","palette":"main"},"amount":{"default":0.5,"type":["range","map"],"min":0,"max":1,"step":0.1,"label":"Amount","group":"Effect"},"preserveLuminosity":{"default":true,"type":"checkbox","label":"Preserve Luminosity","group":"Effect"}},"preview":"/shader-previews/shader-effects-tint.webp"},{"category":"Adjustments","description":"Invert RGB colors while preserving alpha","id":"shader-effects-invert","name":"Invert","nativeControls":{},"preview":"/shader-previews/shader-effects-invert.webp"},{"category":"Adjustments","description":"Convert colors to black and white","id":"shader-effects-grayscale","name":"Grayscale","nativeControls":{},"preview":"/shader-previews/shader-effects-grayscale.webp"},{"category":"Adjustments","description":"Rotate hue around the color wheel","id":"shader-effects-hue-shift","name":"Hue Shift","nativeControls":{"shift":{"default":120,"type":["range","map"],"min":-180,"max":180,"step":1,"label":"Shift","group":"Adjustments"}},"preview":"/shader-previews/shader-effects-hue-shift.webp"},{"category":"Adjustments","description":"Adjust color saturation intensity","id":"shader-effects-saturation","name":"Saturation","nativeControls":{"intensity":{"default":1.8,"type":["range","map"],"min":0,"max":3,"step":0.1,"label":"Intensity","group":"Adjustments"}},"preview":"/shader-previews/shader-effects-saturation.webp"},{"category":"Adjustments","description":"Selective saturation adjustment protecting skin tones","id":"shader-effects-vibrance","name":"Vibrance","nativeControls":{"intensity":{"default":1.2,"type":["range","map"],"min":-2,"max":2,"step":0.1,"label":"Intensity","group":"Adjustments"}},"preview":"/shader-previews/shader-effects-vibrance.webp"},{"category":"Adjustments","description":"Multiplicative exposure (gain) on the child. Unlike additive brightness, it scales values around black — blacks stay black while highlights can be pushed past 1.0 to feed HDR bloom and tone-mapping roll-off. Pointwise, so no extra render pass is needed.","id":"shader-effects-exposure","name":"Exposure","nativeControls":{"exposure":{"default":1.7,"type":["range","map"],"min":0,"max":8,"step":0.1,"label":"Exposure","group":"Adjustments"}},"preview":"/shader-previews/shader-effects-exposure.webp"},{"category":"Adjustments","description":"Adjust brightness and contrast of the image","id":"shader-effects-brightness-contrast","name":"Brightness Contrast","nativeControls":{"brightness":{"default":0.08,"type":["range","map"],"min":-1,"max":1,"step":0.01,"label":"Brightness","group":"Adjustments"},"contrast":{"default":0.45,"type":["range","map"],"min":-1,"max":1,"step":0.01,"label":"Contrast","group":"Adjustments"}},"preview":"/shader-previews/shader-effects-brightness-contrast.webp"},{"category":"Adjustments","description":"Adjust image sharpness using a convolution kernel","id":"shader-effects-sharpness","name":"Sharpness","nativeControls":{"sharpness":{"default":2.5,"type":["range","map"],"min":0,"max":5,"step":0.1,"label":"Sharpness","group":"Adjustments"}},"preview":"/shader-previews/shader-effects-sharpness.webp"}],"requiresWebGPU":true,"usage":"Design Lab Effect layer settings { effectId, effectProps }. Add with design.effects.add and edit with design.effects.configure. The effect processes the composited layers beneath it; exports refuse without WebGPU."}},"skills":[{"id":"glyphfield-create","repositoryPath":"skills/glyphfield-create","useFor":"Layered Design Lab composition, shaders, authored layers, and saved designs"},{"id":"glyphfield-api","repositoryPath":"skills/glyphfield-api","useFor":"Deterministic HTTP discovery, generation, and batch workflows"},{"id":"glyphfield-studio","repositoryPath":"skills/glyphfield-studio","useFor":"Authentic browser Studio operation, source round trips, and local files"},{"id":"glyphfield-export","repositoryPath":"skills/glyphfield-export","useFor":"Still and motion export with artifact, loop, frame, and audio verification"},{"id":"glyphfield-brand","repositoryPath":"skills/glyphfield-brand","useFor":"Set up or improve a brand identity end to end: research, validate, apply, add logo and font files, audit, fix, and export the brand kit"}],"surfaceLibrary":{"browserPreview":{"camera":"fixed","fallback":"deterministic-svg","renderer":"react-three-fiber","userOrbit":false},"controls":{"surfaceAngle":{"default":28,"maximum":180,"minimum":0,"step":1,"type":"number"},"surfaceDepth":{"default":28,"maximum":100,"minimum":0,"step":1,"type":"number"},"surfaceMaterial":{"default":"none","options":["none","kerf-wood","woven-wire","perforated-metal","carved-stone","embossed-paper","brushed-metal","hammered-foil","corrugated-polymer","cork-composite","frosted-glass","iridescent-film","holo-cloth","linen-weave","felted-wool","pebbled-leather","crackle-glaze","sandblasted-plaster","graphite","carbon-twill"],"type":"enum"},"surfaceMetallic":{"default":0,"maximum":100,"minimum":0,"step":1,"type":"number"},"surfaceOpenArea":{"default":52,"maximum":92,"minimum":0,"step":1,"type":"number"},"surfaceRoughness":{"default":58,"maximum":100,"minimum":0,"step":1,"type":"number"},"surfaceScale":{"default":44,"maximum":140,"minimum":12,"step":1,"type":"number"},"surfaceTextureAmount":{"default":72,"maximum":100,"minimum":0,"step":1,"type":"number"},"surfaceIrregularity":{"default":34,"maximum":100,"minimum":0,"step":1,"type":"number"},"surfaceLibraryAssetId":{"default":"","options":["","polyhaven-velour-velvet","ambientcg-fabric-061","ambientcg-leather-037","polyhaven-oak-veneer","polyhaven-plywood","polyhaven-marble","polyhaven-metal-plate","ambientcg-metal-063","polyhaven-beige-wall","polyhaven-rubber-tiles","ambientcg-paper-006"],"type":"enum"}},"count":60,"generationKind":"background","liveShaderCount":197,"liveShaders":[{"category":"Metal","description":"Gem-like refractive smoke with luminous internal color. Paper’s Default preset.","id":"shader-paper-gem-smoke","liveMaterialId":"paper-gem-smoke","mode":"shader","name":"Gem Smoke","previewUrl":"/shader-previews/paper-gem-smoke.webp","source":{"license":"Paper · Apache-2.0","name":"Paper Shaders","url":"https://github.com/paper-design/shaders"}},{"category":"Metal","description":"Architectural chrome shaped by dark reflection cards, narrow strip lights, and restrained movement.","id":"shader-shaders-fluid-chrome","liveMaterialId":"shaders-fluid-chrome","mode":"shader","name":"Architectural Chrome","previewUrl":"/shader-previews/shaders-fluid-chrome.webp","source":{"license":"Source attributed","name":"Shaders.com study","url":"/docs"}},{"category":"Light","description":"An original luminous contour field inspired by Evil Rabbit’s line-based shader direction.","id":"shader-study-line-field","liveMaterialId":"study-line-field","mode":"shader","name":"Electric Lines","previewUrl":"/shader-previews/study-line-field.webp","source":{"license":"Evil Rabbit · visual reference","name":"Design study","url":"https://shaders.evilrabbit.com/#lines"}},{"category":"Metal","description":"A chromatic liquid-metal surface with contour, dispersion, and flowing reflection. Paper’s Default preset.","id":"shader-paper-liquid-metal","liveMaterialId":"paper-liquid-metal","mode":"shader","name":"Liquid Metal","previewUrl":"/shader-previews/paper-liquid-metal.webp","source":{"license":"Paper · Apache-2.0","name":"Paper Shaders","url":"https://github.com/paper-design/shaders"}},{"category":"Metal","description":"Original chrome light cards and moving glares inspired by Evil Rabbit’s metal studies.","id":"shader-study-chrome-glares","liveMaterialId":"study-chrome-glares","mode":"shader","name":"Chrome Glares","previewUrl":"/shader-previews/study-chrome-glares.webp","source":{"license":"Evil Rabbit · visual reference","name":"Design study","url":"https://shaders.evilrabbit.com/#glares"}},{"category":"Light","description":"Volumetric radial light with layered rays, bloom, and atmospheric density. Paper’s Default preset.","id":"shader-paper-god-rays","liveMaterialId":"paper-god-rays","mode":"shader","name":"God Rays","previewUrl":"/shader-previews/paper-god-rays.webp","source":{"license":"Paper · Apache-2.0","name":"Paper Shaders","url":"https://github.com/paper-design/shaders"}},{"category":"Fluid","description":"Marbled color bands warped through layered noise and swirl. Paper’s Default preset.","id":"shader-paper-warp","liveMaterialId":"paper-warp","mode":"shader","name":"Warp","previewUrl":"/shader-previews/paper-warp.webp","source":{"license":"Paper · Apache-2.0","name":"Paper Shaders","url":"https://github.com/paper-design/shaders"}},{"category":"Gradient","description":"A three-color flow resolved through a crisp ordered-dither matrix.","id":"shader-glyphfield-dither-gradient","liveMaterialId":"glyphfield-dither-gradient","mode":"shader","name":"Dither gradient","previewUrl":"/shader-previews/glyphfield-dither-gradient.webp","source":{"license":"Source attributed","name":"Glyphfield","url":"/docs"}},{"category":"Gradient","description":"An original three-color mesh field with broad, editable focal movement.","id":"shader-glyphfield-mesh-gradient","liveMaterialId":"glyphfield-mesh-gradient","mode":"shader","name":"Mesh gradient","previewUrl":"/shader-previews/glyphfield-mesh-gradient.webp","source":{"license":"Source attributed","name":"Glyphfield","url":"/docs"}},{"category":"Light","description":"Soft spectral currents blended into a continuous, luminous energy bloom.","id":"shader-shaders-spectral-bloom","liveMaterialId":"shaders-spectral-bloom","mode":"shader","name":"Spectral Bloom","previewUrl":"/shader-previews/shaders-spectral-bloom.webp","source":{"license":"Source attributed","name":"Shaders.com study","url":"/docs"}},{"category":"Light","description":"An original dark-centered aura with spectral grain and a soft radiant aperture.","id":"shader-study-radiant-void","liveMaterialId":"study-radiant-void","mode":"shader","name":"Radiant Void","previewUrl":"/shader-previews/study-radiant-void.webp","source":{"license":"Grainient · visual reference","name":"Design study","url":"https://grainient.supply/freebies"}},{"category":"Light","description":"Original refractive rings with galactic color separation and tactile grain.","id":"shader-study-galactic-rings","liveMaterialId":"study-galactic-rings","mode":"shader","name":"Galactic Rings","previewUrl":"/shader-previews/study-galactic-rings.webp","source":{"license":"Grainient · visual reference","name":"Design study","url":"https://grainient.supply/freebies"}},{"category":"Fluid","description":"A live GPU dye field adapted from Pavel Dobryakov’s MIT-licensed WebGL Fluid Simulation.","id":"shader-pavel-fluid-energy","liveMaterialId":"pavel-fluid-energy","mode":"shader","name":"Fluid Energy","previewUrl":"/shader-previews/pavel-fluid-energy.webp","source":{"license":"PavelDoGreat · MIT","name":"WebGL Fluid","url":"https://github.com/PavelDoGreat/WebGL-Fluid-Simulation"}},{"category":"Light","description":"A woven holographic textile with procedural folds, thread highlights, and iridescent foil response.","id":"shader-holo-cloth-silk","liveMaterialId":"holo-cloth-silk","mode":"shader","name":"Holo Cloth","previewUrl":"/shader-previews/holo-cloth-silk.webp","source":{"license":"HoloCloth · MIT","name":"Holo material","url":"https://github.com/dmitrykurash/holocloth"}},{"category":"Metal","description":"Merging glass bodies that refract the palette behind them, with chromatic dispersion, Fresnel rims and soft contact shadows.","id":"shader-glyphfield-liquid-glass","liveMaterialId":"glyphfield-liquid-glass","mode":"shader","name":"Liquid Glass","previewUrl":"/shader-previews/glyphfield-liquid-glass.webp","source":{"license":"Source attributed","name":"Glyphfield","url":"/docs"}},{"category":"Light","description":"Shifting underwater light: a dispersed caustic web over a deep palette pool.","id":"shader-glyphfield-caustics","liveMaterialId":"glyphfield-caustics","mode":"shader","name":"Caustics","previewUrl":"/shader-previews/glyphfield-caustics.webp","source":{"license":"Source attributed","name":"Glyphfield","url":"/docs"}},{"category":"Metal","description":"Crumpled holographic foil with thin-film color that follows the viewing angle and the pointer light.","id":"shader-glyphfield-iridescent-foil","liveMaterialId":"glyphfield-iridescent-foil","mode":"shader","name":"Iridescent Foil","previewUrl":"/shader-previews/glyphfield-iridescent-foil.webp","source":{"license":"Source attributed","name":"Glyphfield","url":"/docs"}},{"category":"Light","description":"Domain-warped emission clouds, bright filaments, dark dust lanes and a sparse star field.","id":"shader-glyphfield-nebula","liveMaterialId":"glyphfield-nebula","mode":"shader","name":"Nebula","previewUrl":"/shader-previews/glyphfield-nebula.webp","source":{"license":"Source attributed","name":"Glyphfield","url":"/docs"}},{"category":"Metal","description":"A chromatic liquid-metal surface with contour, dispersion, and flowing reflection. Paper’s Noir preset.","id":"shader-paper-liquid-metal-noir","liveMaterialId":"paper-liquid-metal-noir","mode":"shader","name":"Liquid Metal · Noir","previewUrl":"/shader-previews/paper-liquid-metal-noir.webp","source":{"license":"Paper · Apache-2.0","name":"Paper Shaders","url":"https://github.com/paper-design/shaders"}},{"category":"Gradient","description":"Overlapping satin ribbons with soft folds, sliding sheen and cast shadows.","id":"shader-glyphfield-silk-ribbons","liveMaterialId":"glyphfield-silk-ribbons","mode":"shader","name":"Silk Ribbons","previewUrl":"/shader-previews/glyphfield-silk-ribbons.webp","source":{"license":"Source attributed","name":"Glyphfield","url":"/docs"}},{"category":"Metal","description":"A chromatic liquid-metal surface with contour, dispersion, and flowing reflection. Paper’s Stripes preset.","id":"shader-paper-liquid-metal-stripes","liveMaterialId":"paper-liquid-metal-stripes","mode":"shader","name":"Liquid Metal · Stripes","previewUrl":"/shader-previews/paper-liquid-metal-stripes.webp","source":{"license":"Paper · Apache-2.0","name":"Paper Shaders","url":"https://github.com/paper-design/shaders"}},{"category":"Gradient","description":"A dimensional color relief with editable ridges, grain, and directional light.","id":"shader-study-relief-gradient","liveMaterialId":"study-relief-gradient","mode":"shader","name":"Relief Gradient","previewUrl":"/shader-previews/study-relief-gradient.webp","source":{"license":"Gradientool · visual reference","name":"Design study","url":"https://www.gradientool.com/"}},{"category":"Gradient","description":"Layered color bodies orbiting through a smooth procedural gradient field.","id":"shader-study-orbit-gradient","liveMaterialId":"study-orbit-gradient","mode":"shader","name":"Orbit Gradient","previewUrl":"/shader-previews/study-orbit-gradient.webp","source":{"license":"Gradientool · visual reference","name":"Design study","url":"https://www.gradientool.com/"}},{"category":"Metal","description":"Gem-like refractive smoke with luminous internal color. Paper’s Fire preset.","id":"shader-paper-gem-smoke-fire","liveMaterialId":"paper-gem-smoke-fire","mode":"shader","name":"Gem Smoke · Fire","previewUrl":"/shader-previews/paper-gem-smoke-fire.webp","source":{"license":"Paper · Apache-2.0","name":"Paper Shaders","url":"https://github.com/paper-design/shaders"}},{"category":"Metal","description":"A chromatic liquid-metal surface with contour, dispersion, and flowing reflection. Paper’s Backdrop preset.","id":"shader-paper-liquid-metal-backdrop","liveMaterialId":"paper-liquid-metal-backdrop","mode":"shader","name":"Liquid Metal · Backdrop","previewUrl":"/shader-previews/paper-liquid-metal-backdrop.webp","source":{"license":"Paper · Apache-2.0","name":"Paper Shaders","url":"https://github.com/paper-design/shaders"}},{"category":"Metal","description":"Gem-like refractive smoke with luminous internal color. Paper’s Fluorescent preset.","id":"shader-paper-gem-smoke-fluorescent","liveMaterialId":"paper-gem-smoke-fluorescent","mode":"shader","name":"Gem Smoke · Fluorescent","previewUrl":"/shader-previews/paper-gem-smoke-fluorescent.webp","source":{"license":"Paper · Apache-2.0","name":"Paper Shaders","url":"https://github.com/paper-design/shaders"}},{"category":"Light","description":"Volumetric radial light with layered rays, bloom, and atmospheric density. Paper’s Ether preset.","id":"shader-paper-god-rays-ether","liveMaterialId":"paper-god-rays-ether","mode":"shader","name":"God Rays · Ether","previewUrl":"/shader-previews/paper-god-rays-ether.webp","source":{"license":"Paper · Apache-2.0","name":"Paper Shaders","url":"https://github.com/paper-design/shaders"}},{"category":"Fluid","description":"A turbulent luminous ring shaped by layered GPU noise. Paper’s Solar preset.","id":"shader-paper-smoke-ring-solar","liveMaterialId":"paper-smoke-ring-solar","mode":"shader","name":"Smoke Ring · Solar","previewUrl":"/shader-previews/paper-smoke-ring-solar.webp","source":{"license":"Paper · Apache-2.0","name":"Paper Shaders","url":"https://github.com/paper-design/shaders"}},{"category":"Light","description":"Mesmerizing aurora borealis with layered curtains, vertical rays, and flowing light. · Textures","id":"shader-shader-effects-aurora","liveMaterialId":"shader-effects-aurora","mode":"shader","name":"Aurora","previewUrl":"/shader-previews/shader-effects-aurora.webp","source":{"license":"Shaders.com · MIT","name":"Shaders.com WebGPU","url":"https://github.com/shader-effects-inc/shaders"}},{"category":"Metal","description":"Gem-like refractive smoke with luminous internal color. Paper’s Infrared preset.","id":"shader-paper-gem-smoke-infrared","liveMaterialId":"paper-gem-smoke-infrared","mode":"shader","name":"Gem Smoke · Infrared","previewUrl":"/shader-previews/paper-gem-smoke-infrared.webp","source":{"license":"Paper · Apache-2.0","name":"Paper Shaders","url":"https://github.com/paper-design/shaders"}},{"category":"Metal","description":"Flowing liquid chrome — a molten reflective surface that wraps the shape, sweeping a procedural studio reflection across animated folds with crisp speculars and prismatic edges · Shape Effects","id":"shader-shader-effects-liquid-metal","liveMaterialId":"shader-effects-liquid-metal","mode":"shader","name":"Liquid Metal","previewUrl":"/shader-previews/shader-effects-liquid-metal.webp","source":{"license":"Shaders.com · MIT","name":"Shaders.com WebGPU","url":"https://github.com/shader-effects-inc/shaders"}},{"category":"Metal","description":"Studio-lit mirror chrome — a precision-machined shape with a controllable polished bevel, softly convex faces and a photographic studio reflected in them: one huge frontal softbox, black flags, and thin warm/cool strip lights that fringe amber and ice-blue exactly where the reflections break · Shape Effects","id":"shader-shader-effects-chrome","liveMaterialId":"shader-effects-chrome","mode":"shader","name":"Chrome","previewUrl":"/shader-previews/shader-effects-chrome.webp","source":{"license":"Shaders.com · MIT","name":"Shaders.com WebGPU","url":"https://github.com/shader-effects-inc/shaders"}},{"category":"Light","description":"Iridescent holographic foil sticker with animated rainbow sheen and glitter flakes · Shape Effects","id":"shader-shader-effects-holographic","liveMaterialId":"shader-effects-holographic","mode":"shader","name":"Holographic","previewUrl":"/shader-previews/shader-effects-holographic.webp","source":{"license":"Shaders.com · MIT","name":"Shaders.com WebGPU","url":"https://github.com/shader-effects-inc/shaders"}},{"category":"Light","description":"Volumetric light rays emanating from a point · Textures","id":"shader-shader-effects-godrays","liveMaterialId":"shader-effects-godrays","mode":"shader","name":"Godrays","previewUrl":"/shader-previews/shader-effects-godrays.webp","source":{"license":"Shaders.com · MIT","name":"Shaders.com WebGPU","url":"https://github.com/shader-effects-inc/shaders"}},{"category":"Gradient","description":"Animated effect of glowing plasma · Textures","id":"shader-shader-effects-plasma","liveMaterialId":"shader-effects-plasma","mode":"shader","name":"Plasma","previewUrl":"/shader-previews/shader-effects-plasma.webp","source":{"license":"Shaders.com · MIT","name":"Shaders.com WebGPU","url":"https://github.com/shader-effects-inc/shaders"}},{"category":"Graphic","description":"A soft four-stop flow with a fine print-registration screen.","id":"shader-shaders-soft-register","liveMaterialId":"shaders-soft-register","mode":"shader","name":"Soft Register","previewUrl":"/shader-previews/shaders-soft-register.webp","source":{"license":"Source attributed","name":"Shaders.com study","url":"/docs"}},{"category":"Gradient","description":"Flowing mesh gradient of soft drifting color swaths whose seams wrap through the palette · Textures","id":"shader-shader-effects-mesh-gradient","liveMaterialId":"shader-effects-mesh-gradient","mode":"shader","name":"Mesh Gradient","previewUrl":"/shader-previews/shader-effects-mesh-gradient.webp","source":{"license":"Shaders.com · MIT","name":"Shaders.com WebGPU","url":"https://github.com/shader-effects-inc/shaders"}},{"category":"Light","description":"A volumetric gas nebula sealed inside polished glass; billowing emission clouds with hollow dark cavities and hot glowing cores, star fields drifting at real depth behind the gas, all refracted through the curved walls of the shape and dressed with studio reflections · Shape Effects","id":"shader-shader-effects-nebula","liveMaterialId":"shader-effects-nebula","mode":"shader","name":"Nebula","previewUrl":"/shader-previews/shader-effects-nebula.webp","source":{"license":"Shaders.com · MIT","name":"Shaders.com WebGPU","url":"https://github.com/shader-effects-inc/shaders"}},{"category":"Gradient","description":"Liquid silk gradient with organic flowing color bands · Textures","id":"shader-shader-effects-flowing-gradient","liveMaterialId":"shader-effects-flowing-gradient","mode":"shader","name":"Flowing Gradient","previewUrl":"/shader-previews/shader-effects-flowing-gradient.webp","source":{"license":"Shaders.com · MIT","name":"Shaders.com WebGPU","url":"https://github.com/shader-effects-inc/shaders"}},{"category":"Light","description":"Volumetric radial light with layered rays, bloom, and atmospheric density. Paper’s Linear preset.","id":"shader-paper-god-rays-linear","liveMaterialId":"paper-god-rays-linear","mode":"shader","name":"God Rays · Linear","previewUrl":"/shader-previews/paper-god-rays-linear.webp","source":{"license":"Paper · Apache-2.0","name":"Paper Shaders","url":"https://github.com/paper-design/shaders"}},{"category":"Gradient","description":"A tactile gradient with animated pigment movement and integrated film grain.","id":"shader-glyphfield-grain-gradient","liveMaterialId":"glyphfield-grain-gradient","mode":"shader","name":"Grain gradient","previewUrl":"/shader-previews/glyphfield-grain-gradient.webp","source":{"license":"Source attributed","name":"Glyphfield","url":"/docs"}},{"category":"Fluid","description":"Volumetric radial light with layered rays, bloom, and atmospheric density. Paper’s Warp preset.","id":"shader-paper-god-rays-warp","liveMaterialId":"paper-god-rays-warp","mode":"shader","name":"God Rays · Warp","previewUrl":"/shader-previews/paper-god-rays-warp.webp","source":{"license":"Paper · Apache-2.0","name":"Paper Shaders","url":"https://github.com/paper-design/shaders"}},{"category":"Gradient","description":"Flowing color spots with organic distortion, swirl, and fine surface grain. Paper’s Purple preset.","id":"shader-paper-mesh-gradient-purple","liveMaterialId":"paper-mesh-gradient-purple","mode":"shader","name":"Mesh Gradient · Purple","previewUrl":"/shader-previews/paper-mesh-gradient-purple.webp","source":{"license":"Paper · Apache-2.0","name":"Paper Shaders","url":"https://github.com/paper-design/shaders"}},{"category":"Light","description":"A beam of light that fans out and splits into a slowly-rotating rainbow past a controllable point. Transparent background — composite over a dark layer. · Textures","id":"shader-shader-effects-prism","liveMaterialId":"shader-effects-prism","mode":"shader","name":"Prism","previewUrl":"/shader-previews/shader-effects-prism.webp","source":{"license":"Shaders.com · MIT","name":"Shaders.com WebGPU","url":"https://github.com/shader-effects-inc/shaders"}},{"category":"Gradient","description":"Flowing ribbons of light with a multi-color gradient · Textures","id":"shader-shader-effects-strands","liveMaterialId":"shader-effects-strands","mode":"shader","name":"Strands","previewUrl":"/shader-previews/shader-effects-strands.webp","source":{"license":"Shaders.com · MIT","name":"Shaders.com WebGPU","url":"https://github.com/shader-effects-inc/shaders"}},{"category":"Fluid","description":"A turbulent luminous ring shaped by layered GPU noise. Paper’s Default preset.","id":"shader-paper-smoke-ring","liveMaterialId":"paper-smoke-ring","mode":"shader","name":"Smoke Ring","previewUrl":"/shader-previews/paper-smoke-ring.webp","source":{"license":"Paper · Apache-2.0","name":"Paper Shaders","url":"https://github.com/paper-design/shaders"}},{"category":"Fluid","description":"Marbled color bands warped through layered noise and swirl. Paper’s Live Ink preset.","id":"shader-paper-warp-live-ink","liveMaterialId":"paper-warp-live-ink","mode":"shader","name":"Warp · Live Ink","previewUrl":"/shader-previews/paper-warp-live-ink.webp","source":{"license":"Paper · Apache-2.0","name":"Paper Shaders","url":"https://github.com/paper-design/shaders"}},{"category":"Graphic","description":"Directional chroma movement viewed through fluted glass.","id":"shader-shaders-chroma-flow","liveMaterialId":"shaders-chroma-flow","mode":"shader","name":"Chroma Flow","previewUrl":"/shader-previews/shaders-chroma-flow.webp","source":{"license":"Source attributed","name":"Shaders.com study","url":"/docs"}},{"category":"Fluid","description":"A turbulent luminous ring shaped by layered GPU noise. Paper’s Cloud preset.","id":"shader-paper-smoke-ring-cloud","liveMaterialId":"paper-smoke-ring-cloud","mode":"shader","name":"Smoke Ring · Cloud","previewUrl":"/shader-previews/paper-smoke-ring-cloud.webp","source":{"license":"Paper · Apache-2.0","name":"Paper Shaders","url":"https://github.com/paper-design/shaders"}},{"category":"Gradient","description":"Flowing color spots with organic distortion, swirl, and fine surface grain. Paper’s Default preset.","id":"shader-paper-mesh-gradient","liveMaterialId":"paper-mesh-gradient","mode":"shader","name":"Mesh Gradient","previewUrl":"/shader-previews/paper-mesh-gradient.webp","source":{"license":"Paper · Apache-2.0","name":"Paper Shaders","url":"https://github.com/paper-design/shaders"}},{"category":"Fluid","description":"A turbulent luminous ring shaped by layered GPU noise. Paper’s Line preset.","id":"shader-paper-smoke-ring-line","liveMaterialId":"paper-smoke-ring-line","mode":"shader","name":"Smoke Ring · Line","previewUrl":"/shader-previews/paper-smoke-ring-line.webp","source":{"license":"Paper · Apache-2.0","name":"Paper Shaders","url":"https://github.com/paper-design/shaders"}},{"category":"Graphic","description":"Hard directional rays broken across a tactile paper surface.","id":"shader-shaders-pistons","liveMaterialId":"shaders-pistons","mode":"shader","name":"Pistons","previewUrl":"/shader-previews/shaders-pistons.webp","source":{"license":"Source attributed","name":"Shaders.com study","url":"/docs"}},{"category":"Gradient","description":"A tactile animated gradient with dense analog grain and soft color bloom. Paper’s Wave preset.","id":"shader-paper-grain-gradient-wave","liveMaterialId":"paper-grain-gradient-wave","mode":"shader","name":"Grain Gradient · Wave","previewUrl":"/shader-previews/paper-grain-gradient-wave.webp","source":{"license":"Paper · Apache-2.0","name":"Paper Shaders","url":"https://github.com/paper-design/shaders"}},{"category":"Gradient","description":"Flowing color spots with organic distortion, swirl, and fine surface grain. Paper’s Beach preset.","id":"shader-paper-mesh-gradient-beach","liveMaterialId":"paper-mesh-gradient-beach","mode":"shader","name":"Mesh Gradient · Beach","previewUrl":"/shader-previews/paper-mesh-gradient-beach.webp","source":{"license":"Paper · Apache-2.0","name":"Paper Shaders","url":"https://github.com/paper-design/shaders"}},{"category":"Graphic","description":"A controlled smoke plume with editable emission and decay.","id":"shader-shaders-drift","liveMaterialId":"shaders-drift","mode":"shader","name":"Drift","previewUrl":"/shader-previews/shaders-drift.webp","source":{"license":"Source attributed","name":"Shaders.com study","url":"/docs"}},{"category":"Gradient","description":"Flowing color spots with organic distortion, swirl, and fine surface grain. Paper’s Ink preset.","id":"shader-paper-mesh-gradient-ink","liveMaterialId":"paper-mesh-gradient-ink","mode":"shader","name":"Mesh Gradient · Ink","previewUrl":"/shader-previews/paper-mesh-gradient-ink.webp","source":{"license":"Paper · Apache-2.0","name":"Paper Shaders","url":"https://github.com/paper-design/shaders"}},{"category":"Fluid","description":"Refractive water caustics with layered surface motion. Paper’s Abstract preset.","id":"shader-paper-water-abstract","liveMaterialId":"paper-water-abstract","mode":"shader","name":"Water · Abstract","previewUrl":"/shader-previews/paper-water-abstract.webp","source":{"license":"Paper · Apache-2.0","name":"Paper Shaders","url":"https://github.com/paper-design/shaders"}},{"category":"Metal","description":"The supplied animated sphere preset with environment light and film grain.","id":"shader-shadergradient-prismatic-sphere","liveMaterialId":"shadergradient-prismatic-sphere","mode":"shader","name":"Prismatic sphere","previewUrl":"/shader-previews/shadergradient-prismatic-sphere.webp","source":{"license":"Source attributed","name":"ShaderGradient","url":"/docs"}},{"category":"Graphic","description":"A spatial letterform built from hundreds of live glyphs, with editable depth, motion, density, and color.","id":"shader-glyphfield-glyph-field","liveMaterialId":"glyphfield-glyph-field","mode":"shader","name":"Glyph field","previewUrl":"/shader-previews/glyphfield-glyph-field.webp","source":{"license":"Source attributed","name":"Glyphfield","url":"/docs"}},{"category":"Metal","description":"Dark tinted glass whose faces stay near-black while every surface turning away from the viewer ignites with a flowing iridescent gradient — vivid color living only on the oblique walls and bevels · Shape Effects","id":"shader-shader-effects-obsidian","liveMaterialId":"shader-effects-obsidian","mode":"shader","name":"Obsidian","previewUrl":"/shader-previews/shader-effects-obsidian.webp","source":{"license":"Shaders.com · MIT","name":"Shaders.com WebGPU","url":"https://github.com/shader-effects-inc/shaders"}},{"category":"Fluid","description":"Marbled color bands warped through layered noise and swirl. Paper’s Cauldron Pot preset.","id":"shader-paper-warp-cauldron-pot","liveMaterialId":"paper-warp-cauldron-pot","mode":"shader","name":"Warp · Cauldron Pot","previewUrl":"/shader-previews/paper-warp-cauldron-pot.webp","source":{"license":"Paper · Apache-2.0","name":"Paper Shaders","url":"https://github.com/paper-design/shaders"}},{"category":"Light","description":"Glowing, pulsing light racing around the edge of any 2D, SVG, or 3D shape. Powered by Paper Shaders. · Shape Effects","id":"shader-shader-effects-light-edge","liveMaterialId":"shader-effects-light-edge","mode":"shader","name":"Light Edge","previewUrl":"/shader-previews/shader-effects-light-edge.webp","source":{"license":"Shaders.com · MIT","name":"Shaders.com WebGPU","url":"https://github.com/shader-effects-inc/shaders"}},{"category":"Fluid","description":"Marbled color bands warped through layered noise and swirl. Paper’s Kelp preset.","id":"shader-paper-warp-kelp","liveMaterialId":"paper-warp-kelp","mode":"shader","name":"Warp · Kelp","previewUrl":"/shader-previews/paper-warp-kelp.webp","source":{"license":"Paper · Apache-2.0","name":"Paper Shaders","url":"https://github.com/paper-design/shaders"}},{"category":"Gradient","description":"A tactile animated gradient with dense analog grain and soft color bloom. Paper’s Default preset.","id":"shader-paper-grain-gradient","liveMaterialId":"paper-grain-gradient","mode":"shader","name":"Grain Gradient","previewUrl":"/shader-previews/paper-grain-gradient.webp","source":{"license":"Paper · Apache-2.0","name":"Paper Shaders","url":"https://github.com/paper-design/shaders"}},{"category":"Fluid","description":"Marbled color bands warped through layered noise and swirl. Paper’s Nectar preset.","id":"shader-paper-warp-nectar","liveMaterialId":"paper-warp-nectar","mode":"shader","name":"Warp · Nectar","previewUrl":"/shader-previews/paper-warp-nectar.webp","source":{"license":"Paper · Apache-2.0","name":"Paper Shaders","url":"https://github.com/paper-design/shaders"}},{"category":"Light","description":"Photorealistic neon tube / 3D pipe effect driven by a custom shape · Shape Effects","id":"shader-shader-effects-neon","liveMaterialId":"shader-effects-neon","mode":"shader","name":"Neon","previewUrl":"/shader-previews/shader-effects-neon.webp","source":{"license":"Shaders.com · MIT","name":"Shaders.com WebGPU","url":"https://github.com/shader-effects-inc/shaders"}},{"category":"Fluid","description":"Marbled color bands warped through layered noise and swirl. Paper’s Passion preset.","id":"shader-paper-warp-passion","liveMaterialId":"paper-warp-passion","mode":"shader","name":"Warp · Passion","previewUrl":"/shader-previews/paper-warp-passion.webp","source":{"license":"Paper · Apache-2.0","name":"Paper Shaders","url":"https://github.com/paper-design/shaders"}},{"category":"Light","description":"Photorealistic light spilling around the edge of any 2D, SVG, or 3D shape — any number of movable colored point lights strike the silhouette and the lit edges irradiate their surroundings, gathered in a compute pass with real cast shadows, mixing where they meet and burning to white at the rim · Shape Effects","id":"shader-shader-effects-irradiance","liveMaterialId":"shader-effects-irradiance","mode":"shader","name":"Irradiance","previewUrl":"/shader-previews/shader-effects-irradiance.webp","source":{"license":"Shaders.com · MIT","name":"Shaders.com WebGPU","url":"https://github.com/shader-effects-inc/shaders"}},{"category":"Fluid","description":"Translucent water — a refractive, light-absorbing body that deepens to its color with thickness, wrapped in a wind-driven wave surface that reflects a procedural sky, with Fresnel-bright grazing edges and foam breaking on the crests and shoreline · Shape Effects","id":"shader-shader-effects-water","liveMaterialId":"shader-effects-water","mode":"shader","name":"Water","previewUrl":"/shader-previews/shader-effects-water.webp","source":{"license":"Shaders.com · MIT","name":"Shaders.com WebGPU","url":"https://github.com/shader-effects-inc/shaders"}},{"category":"Fluid","description":"Classic marble swirl and vein texture using noise-warped sine waves · Textures","id":"shader-shader-effects-marble","liveMaterialId":"shader-effects-marble","mode":"shader","name":"Marble","previewUrl":"/shader-previews/shader-effects-marble.webp","source":{"license":"Shaders.com · MIT","name":"Shaders.com WebGPU","url":"https://github.com/shader-effects-inc/shaders"}},{"category":"Fluid","description":"Flowing swirl pattern with multi-layered noise · Textures","id":"shader-shader-effects-swirl","liveMaterialId":"shader-effects-swirl","mode":"shader","name":"Swirl","previewUrl":"/shader-previews/shader-effects-swirl.webp","source":{"license":"Shaders.com · MIT","name":"Shaders.com WebGPU","url":"https://github.com/shader-effects-inc/shaders"}},{"category":"Fluid","description":"Organic animated blob with 3D lighting and gradients · Textures","id":"shader-shader-effects-blob","liveMaterialId":"shader-effects-blob","mode":"shader","name":"Blob","previewUrl":"/shader-previews/shader-effects-blob.webp","source":{"license":"Shaders.com · MIT","name":"Shaders.com WebGPU","url":"https://github.com/shader-effects-inc/shaders"}},{"category":"Metal","description":"Photorealistic brushed metal — a satin anodised surface combed with fine directional grain that smears the reflected studio and key light into the long anisotropic streaks of real brushed aluminium, steel, gold or copper · Shape Effects","id":"shader-shader-effects-brushed-metal","liveMaterialId":"shader-effects-brushed-metal","mode":"shader","name":"Brushed Metal","previewUrl":"/shader-previews/shader-effects-brushed-metal.webp","source":{"license":"Shaders.com · MIT","name":"Shaders.com WebGPU","url":"https://github.com/shader-effects-inc/shaders"}},{"category":"Gradient","description":"A tactile animated gradient with dense analog grain and soft color bloom. Paper’s Blob preset.","id":"shader-paper-grain-gradient-blob","liveMaterialId":"paper-grain-gradient-blob","mode":"shader","name":"Grain Gradient · Blob","previewUrl":"/shader-previews/paper-grain-gradient-blob.webp","source":{"license":"Paper · Apache-2.0","name":"Paper Shaders","url":"https://github.com/paper-design/shaders"}},{"category":"Light","description":"Volumetric sci-fi hologram — a translucent emissive projection of the shape with fresnel-lit edges, depth scan-lines that wrap 3D forms, CRT scanlines, flicker and beam wobble · Shape Effects","id":"shader-shader-effects-hologram","liveMaterialId":"shader-effects-hologram","mode":"shader","name":"Hologram","previewUrl":"/shader-previews/shader-effects-hologram.webp","source":{"license":"Shaders.com · MIT","name":"Shaders.com WebGPU","url":"https://github.com/shader-effects-inc/shaders"}},{"category":"Gradient","description":"A tactile animated gradient with dense analog grain and soft color bloom. Paper’s Dots preset.","id":"shader-paper-grain-gradient-dots","liveMaterialId":"paper-grain-gradient-dots","mode":"shader","name":"Grain Gradient · Dots","previewUrl":"/shader-previews/paper-grain-gradient-dots.webp","source":{"license":"Paper · Apache-2.0","name":"Paper Shaders","url":"https://github.com/paper-design/shaders"}},{"category":"Metal","description":"Photoreal frozen ice — thickness-driven subsurface scattering that reads as a solid block, with fine frost crystals creeping in from the edges · Shape Effects","id":"shader-shader-effects-frost","liveMaterialId":"shader-effects-frost","mode":"shader","name":"Frost","previewUrl":"/shader-previews/shader-effects-frost.webp","source":{"license":"Shaders.com · MIT","name":"Shaders.com WebGPU","url":"https://github.com/shader-effects-inc/shaders"}},{"category":"Gradient","description":"A tactile animated gradient with dense analog grain and soft color bloom. Paper’s Ripple preset.","id":"shader-paper-grain-gradient-ripple","liveMaterialId":"paper-grain-gradient-ripple","mode":"shader","name":"Grain Gradient · Ripple","previewUrl":"/shader-previews/paper-grain-gradient-ripple.webp","source":{"license":"Paper · Apache-2.0","name":"Paper Shaders","url":"https://github.com/paper-design/shaders"}},{"category":"Metal","description":"Glossy molded plastic with photorealistic studio reflections, driven in a custom shape · Shape Effects","id":"shader-shader-effects-plastic","liveMaterialId":"shader-effects-plastic","mode":"shader","name":"Plastic","previewUrl":"/shader-previews/shader-effects-plastic.webp","source":{"license":"Shaders.com · MIT","name":"Shaders.com WebGPU","url":"https://github.com/shader-effects-inc/shaders"}},{"category":"Gradient","description":"A tactile animated gradient with dense analog grain and soft color bloom. Paper’s Truchet preset.","id":"shader-paper-grain-gradient-truchet","liveMaterialId":"paper-grain-gradient-truchet","mode":"shader","name":"Grain Gradient · Truchet","previewUrl":"/shader-previews/paper-grain-gradient-truchet.webp","source":{"license":"Paper · Apache-2.0","name":"Paper Shaders","url":"https://github.com/paper-design/shaders"}},{"category":"Fluid","description":"Refractive water caustics with layered surface motion. Paper’s Default preset.","id":"shader-paper-water","liveMaterialId":"paper-water","mode":"shader","name":"Water","previewUrl":"/shader-previews/paper-water.webp","source":{"license":"Paper · Apache-2.0","name":"Paper Shaders","url":"https://github.com/paper-design/shaders"}},{"category":"Fluid","description":"Photoreal wet liquid — animated 3D metaball blobs that merge and bulge to loosely form the shape, with sliding wet highlights, a clearcoat rim and a translucent body · Shape Effects","id":"shader-shader-effects-goo","liveMaterialId":"shader-effects-goo","mode":"shader","name":"Goo","previewUrl":"/shader-previews/shader-effects-goo.webp","source":{"license":"Shaders.com · MIT","name":"Shaders.com WebGPU","url":"https://github.com/shader-effects-inc/shaders"}},{"category":"Light","description":"Realistic camera lens flare with artifacts. · Stylize","id":"shader-shader-effects-lens-flare","liveMaterialId":"shader-effects-lens-flare","mode":"shader","name":"Lens Flare","previewUrl":"/shader-previews/shader-effects-lens-flare.webp","source":{"license":"Shaders.com · MIT","name":"Shaders.com WebGPU","url":"https://github.com/shader-effects-inc/shaders"}},{"category":"Light","description":"A neon grid warped over a moving high-contrast field.","id":"shader-shaders-circuit","liveMaterialId":"shaders-circuit","mode":"shader","name":"Circuit","previewUrl":"/shader-previews/shaders-circuit.webp","source":{"license":"Source attributed","name":"Shaders.com study","url":"/docs"}},{"category":"Fluid","description":"Refractive water caustics with layered surface motion. Paper’s Slow-mo preset.","id":"shader-paper-water-slow-mo","liveMaterialId":"paper-water-slow-mo","mode":"shader","name":"Water · Slow-mo","previewUrl":"/shader-previews/paper-water-slow-mo.webp","source":{"license":"Paper · Apache-2.0","name":"Paper Shaders","url":"https://github.com/paper-design/shaders"}},{"category":"Gradient","description":"A neural field of animated filaments, contrast, and colored light. Paper’s Default preset.","id":"shader-paper-neuro-noise","liveMaterialId":"paper-neuro-noise","mode":"shader","name":"Neuro Noise","previewUrl":"/shader-previews/paper-neuro-noise.webp","source":{"license":"Paper · Apache-2.0","name":"Paper Shaders","url":"https://github.com/paper-design/shaders"}},{"category":"Fluid","description":"Refractive water caustics with layered surface motion. Paper’s Streaming preset.","id":"shader-paper-water-streaming","liveMaterialId":"paper-water-streaming","mode":"shader","name":"Water · Streaming","previewUrl":"/shader-previews/paper-water-streaming.webp","source":{"license":"Paper · Apache-2.0","name":"Paper Shaders","url":"https://github.com/paper-design/shaders"}},{"category":"Gradient","description":"A neural field of animated filaments, contrast, and colored light. Paper’s Bloodstream preset.","id":"shader-paper-neuro-noise-bloodstream","liveMaterialId":"paper-neuro-noise-bloodstream","mode":"shader","name":"Neuro Noise · Bloodstream","previewUrl":"/shader-previews/paper-neuro-noise-bloodstream.webp","source":{"license":"Paper · Apache-2.0","name":"Paper Shaders","url":"https://github.com/paper-design/shaders"}},{"category":"Fluid","description":"Soft animated color bodies merging through an implicit surface field. Paper’s Default preset.","id":"shader-paper-metaballs","liveMaterialId":"paper-metaballs","mode":"shader","name":"Metaballs","previewUrl":"/shader-previews/paper-metaballs.webp","source":{"license":"Paper · Apache-2.0","name":"Paper Shaders","url":"https://github.com/paper-design/shaders"}},{"category":"Gradient","description":"A neural field of animated filaments, contrast, and colored light. Paper’s Ghost preset.","id":"shader-paper-neuro-noise-ghost","liveMaterialId":"paper-neuro-noise-ghost","mode":"shader","name":"Neuro Noise · Ghost","previewUrl":"/shader-previews/paper-neuro-noise-ghost.webp","source":{"license":"Paper · Apache-2.0","name":"Paper Shaders","url":"https://github.com/paper-design/shaders"}},{"category":"Fluid","description":"Soft animated color bodies merging through an implicit surface field. Paper’s Background preset.","id":"shader-paper-metaballs-background","liveMaterialId":"paper-metaballs-background","mode":"shader","name":"Metaballs · Background","previewUrl":"/shader-previews/paper-metaballs-background.webp","source":{"license":"Paper · Apache-2.0","name":"Paper Shaders","url":"https://github.com/paper-design/shaders"}},{"category":"Gradient","description":"A neural field of animated filaments, contrast, and colored light. Paper’s Sensation preset.","id":"shader-paper-neuro-noise-sensation","liveMaterialId":"paper-neuro-noise-sensation","mode":"shader","name":"Neuro Noise · Sensation","previewUrl":"/shader-previews/paper-neuro-noise-sensation.webp","source":{"license":"Paper · Apache-2.0","name":"Paper Shaders","url":"https://github.com/paper-design/shaders"}},{"category":"Fluid","description":"Soft animated color bodies merging through an implicit surface field. Paper’s Ink Drops preset.","id":"shader-paper-metaballs-ink-drops","liveMaterialId":"paper-metaballs-ink-drops","mode":"shader","name":"Metaballs · Ink Drops","previewUrl":"/shader-previews/paper-metaballs-ink-drops.webp","source":{"license":"Paper · Apache-2.0","name":"Paper Shaders","url":"https://github.com/paper-design/shaders"}},{"category":"Fluid","description":"Fill a shape with swirling fluid smoke that interacts with the shape boundary · Shape Effects","id":"shader-shader-effects-smoke-fill","liveMaterialId":"shader-effects-smoke-fill","mode":"shader","name":"Smoke Fill","previewUrl":"/shader-previews/shader-effects-smoke-fill.webp","source":{"license":"Shaders.com · MIT","name":"Shaders.com WebGPU","url":"https://github.com/shader-effects-inc/shaders"}},{"category":"Fluid","description":"Soft animated color bodies merging through an implicit surface field. Paper’s Solar preset.","id":"shader-paper-metaballs-solar","liveMaterialId":"paper-metaballs-solar","mode":"shader","name":"Metaballs · Solar","previewUrl":"/shader-previews/paper-metaballs-solar.webp","source":{"license":"Paper · Apache-2.0","name":"Paper Shaders","url":"https://github.com/paper-design/shaders"}},{"category":"Fluid","description":"Drag to paint swirling ribbons of ink through a real fluid field — eddies keep evolving after you let go · Interactive","id":"shader-shader-effects-ink-flow","liveMaterialId":"shader-effects-ink-flow","mode":"shader","name":"Ink Flow","previewUrl":"/shader-previews/shader-effects-ink-flow.webp","source":{"license":"Shaders.com · MIT","name":"Shaders.com WebGPU","url":"https://github.com/shader-effects-inc/shaders"}},{"category":"Fluid","description":"Realistic fluid smoke simulation with vorticity dynamics · Interactive","id":"shader-shader-effects-smoke","liveMaterialId":"shader-effects-smoke","mode":"shader","name":"Smoke","previewUrl":"/shader-previews/shader-effects-smoke.webp","source":{"license":"Shaders.com · MIT","name":"Shaders.com WebGPU","url":"https://github.com/shader-effects-inc/shaders"}},{"category":"Fluid","description":"Cursor-driven smoke that lingers, swirls, and dissipates with fluid dynamics · Interactive","id":"shader-shader-effects-smoke-flow","liveMaterialId":"shader-effects-smoke-flow","mode":"shader","name":"Smoke Flow","previewUrl":"/shader-previews/shader-effects-smoke-flow.webp","source":{"license":"Shaders.com · MIT","name":"Shaders.com WebGPU","url":"https://github.com/shader-effects-inc/shaders"}},{"category":"Graphic","description":"An animated swirl reduced into a graphic pixel mosaic.","id":"shader-shaders-mosaic","liveMaterialId":"shaders-mosaic","mode":"shader","name":"Mosaic","previewUrl":"/shader-previews/shaders-mosaic.webp","source":{"license":"Source attributed","name":"Shaders.com study","url":"/docs"}},{"category":"Fluid","description":"A living Gray-Scott reaction-diffusion pattern that fills the layer and blooms wherever you drag the cursor · Interactive","id":"shader-shader-effects-reaction-diffusion","liveMaterialId":"shader-effects-reaction-diffusion","mode":"shader","name":"Reaction Diffusion","previewUrl":"/shader-previews/shader-effects-reaction-diffusion.webp","source":{"license":"Shaders.com · MIT","name":"Shaders.com WebGPU","url":"https://github.com/shader-effects-inc/shaders"}},{"category":"Fluid","description":"Interactive liquid flow effect that follows your cursor · Interactive","id":"shader-shader-effects-chroma-flow","liveMaterialId":"shader-effects-chroma-flow","mode":"shader","name":"Chroma Flow","previewUrl":"/shader-previews/shader-effects-chroma-flow.webp","source":{"license":"Shaders.com · MIT","name":"Shaders.com WebGPU","url":"https://github.com/shader-effects-inc/shaders"}},{"category":"Fluid","description":"Fog that fills the screen and interacts with the mouse · Interactive","id":"shader-shader-effects-fog","liveMaterialId":"shader-effects-fog","mode":"shader","name":"Fog","previewUrl":"/shader-previews/shader-effects-fog.webp","source":{"license":"Shaders.com · MIT","name":"Shaders.com WebGPU","url":"https://github.com/shader-effects-inc/shaders"}},{"category":"Light","description":"Thousands of drifting dust particles carried by a real incompressible fluid field the cursor stirs — drag to plow a wake and the particles ride the eddies and vortices it leaves behind, while a gentle ambient breeze keeps the whole scene breathing on its own · Interactive","id":"shader-shader-effects-particle-flow","liveMaterialId":"shader-effects-particle-flow","mode":"shader","name":"Particle Flow","previewUrl":"/shader-previews/shader-effects-particle-flow.webp","source":{"license":"Shaders.com · MIT","name":"Shaders.com WebGPU","url":"https://github.com/shader-effects-inc/shaders"}},{"category":"Light","description":"Thousands of tiny iron filings scattered on paper that swing to align with a magnetic field around the cursor, tracing out the field lines — a dipole whose axis follows the cursor's motion draws the classic two-lobed swirl, and every sweep of the magnet sends a glowing wave of filings flipping and settling · Interactive","id":"shader-shader-effects-magnetic-filings","liveMaterialId":"shader-effects-magnetic-filings","mode":"shader","name":"Magnetic Filings","previewUrl":"/shader-previews/shader-effects-magnetic-filings.webp","source":{"license":"Shaders.com · MIT","name":"Shaders.com WebGPU","url":"https://github.com/shader-effects-inc/shaders"}},{"category":"Light","description":"A living murmuration of hundreds of flocking agents drawn as crisp arrows, streaks, dots or glowing comets — separation, alignment and cohesion drive fluid, splitting-and-merging ribbons, agents flash toward an excited color when scattered, and the cursor acts as an attractor or a predator · Interactive","id":"shader-shader-effects-boids","liveMaterialId":"shader-effects-boids","mode":"shader","name":"Boids","previewUrl":"/shader-previews/shader-effects-boids.webp","source":{"license":"Shaders.com · MIT","name":"Shaders.com WebGPU","url":"https://github.com/shader-effects-inc/shaders"}},{"category":"Graphic","description":"Plasma sliced through an adjustable ordered-dither field.","id":"shader-shaders-pixel-beams","liveMaterialId":"shaders-pixel-beams","mode":"shader","name":"Pixel Beams","previewUrl":"/shader-previews/shaders-pixel-beams.webp","source":{"license":"Source attributed","name":"Shaders.com study","url":"/docs"}},{"category":"Fluid","description":"Layered color bands twisted into a soft animated vortex. Paper’s Default preset.","id":"shader-paper-swirl","liveMaterialId":"paper-swirl","mode":"shader","name":"Swirl","previewUrl":"/shader-previews/paper-swirl.webp","source":{"license":"Paper · Apache-2.0","name":"Paper Shaders","url":"https://github.com/paper-design/shaders"}},{"category":"Gradient","description":"Dimensional translucent color planes with animated depth. Paper’s Default preset.","id":"shader-paper-color-panels","liveMaterialId":"paper-color-panels","mode":"shader","name":"Color Panels","previewUrl":"/shader-previews/paper-color-panels.webp","source":{"license":"Paper · Apache-2.0","name":"Paper Shaders","url":"https://github.com/paper-design/shaders"}},{"category":"Fluid","description":"Layered color bands twisted into a soft animated vortex. Paper’s 007 preset.","id":"shader-paper-swirl-007","liveMaterialId":"paper-swirl-007","mode":"shader","name":"Swirl · 007","previewUrl":"/shader-previews/paper-swirl-007.webp","source":{"license":"Paper · Apache-2.0","name":"Paper Shaders","url":"https://github.com/paper-design/shaders"}},{"category":"Metal","description":"Dimensional translucent color planes with animated depth. Paper’s Glass preset.","id":"shader-paper-color-panels-glass","liveMaterialId":"paper-color-panels-glass","mode":"shader","name":"Color Panels · Glass","previewUrl":"/shader-previews/paper-color-panels-glass.webp","source":{"license":"Paper · Apache-2.0","name":"Paper Shaders","url":"https://github.com/paper-design/shaders"}},{"category":"Fluid","description":"Layered color bands twisted into a soft animated vortex. Paper’s Candy preset.","id":"shader-paper-swirl-candy","liveMaterialId":"paper-swirl-candy","mode":"shader","name":"Swirl · Candy","previewUrl":"/shader-previews/paper-swirl-candy.webp","source":{"license":"Paper · Apache-2.0","name":"Paper Shaders","url":"https://github.com/paper-design/shaders"}},{"category":"Gradient","description":"Dimensional translucent color planes with animated depth. Paper’s Gradient preset.","id":"shader-paper-color-panels-gradient","liveMaterialId":"paper-color-panels-gradient","mode":"shader","name":"Color Panels · Gradient","previewUrl":"/shader-previews/paper-color-panels-gradient.webp","source":{"license":"Paper · Apache-2.0","name":"Paper Shaders","url":"https://github.com/paper-design/shaders"}},{"category":"Fluid","description":"Layered color bands twisted into a soft animated vortex. Paper’s Opening preset.","id":"shader-paper-swirl-opening","liveMaterialId":"paper-swirl-opening","mode":"shader","name":"Swirl · Opening","previewUrl":"/shader-previews/paper-swirl-opening.webp","source":{"license":"Paper · Apache-2.0","name":"Paper Shaders","url":"https://github.com/paper-design/shaders"}},{"category":"Gradient","description":"Dimensional translucent color planes with animated depth. Paper’s Opening preset.","id":"shader-paper-color-panels-opening","liveMaterialId":"paper-color-panels-opening","mode":"shader","name":"Color Panels · Opening","previewUrl":"/shader-previews/paper-color-panels-opening.webp","source":{"license":"Paper · Apache-2.0","name":"Paper Shaders","url":"https://github.com/paper-design/shaders"}},{"category":"Light","description":"Ordered GPU dithering over animated procedural fields. Paper’s Default preset.","id":"shader-paper-dithering","liveMaterialId":"paper-dithering","mode":"shader","name":"Dithering","previewUrl":"/shader-previews/paper-dithering.webp","source":{"license":"Paper · Apache-2.0","name":"Paper Shaders","url":"https://github.com/paper-design/shaders"}},{"category":"Graphic","description":"Thermal contour mapping with glow, depth, and atmospheric noise. Paper’s Default preset.","id":"shader-paper-heatmap","liveMaterialId":"paper-heatmap","mode":"shader","name":"Heatmap","previewUrl":"/shader-previews/paper-heatmap.webp","source":{"license":"Paper · Apache-2.0","name":"Paper Shaders","url":"https://github.com/paper-design/shaders"}},{"category":"Light","description":"Ordered GPU dithering over animated procedural fields. Paper’s Bugs preset.","id":"shader-paper-dithering-bugs","liveMaterialId":"paper-dithering-bugs","mode":"shader","name":"Dithering · Bugs","previewUrl":"/shader-previews/paper-dithering-bugs.webp","source":{"license":"Paper · Apache-2.0","name":"Paper Shaders","url":"https://github.com/paper-design/shaders"}},{"category":"Graphic","description":"Thermal contour mapping with glow, depth, and atmospheric noise. Paper’s Sepia preset.","id":"shader-paper-heatmap-sepia","liveMaterialId":"paper-heatmap-sepia","mode":"shader","name":"Heatmap · Sepia","previewUrl":"/shader-previews/paper-heatmap-sepia.webp","source":{"license":"Paper · Apache-2.0","name":"Paper Shaders","url":"https://github.com/paper-design/shaders"}},{"category":"Light","description":"Ordered GPU dithering over animated procedural fields. Paper’s Ripple preset.","id":"shader-paper-dithering-ripple","liveMaterialId":"paper-dithering-ripple","mode":"shader","name":"Dithering · Ripple","previewUrl":"/shader-previews/paper-dithering-ripple.webp","source":{"license":"Paper · Apache-2.0","name":"Paper Shaders","url":"https://github.com/paper-design/shaders"}},{"category":"Metal","description":"Image refraction through animated fluted and folded glass. Paper’s Default preset.","id":"shader-paper-fluted-glass","liveMaterialId":"paper-fluted-glass","mode":"shader","name":"Fluted Glass","previewUrl":"/shader-previews/paper-fluted-glass.webp","source":{"license":"Paper · Apache-2.0","name":"Paper Shaders","url":"https://github.com/paper-design/shaders"}},{"category":"Light","description":"Ordered GPU dithering over animated procedural fields. Paper’s Sine Wave preset.","id":"shader-paper-dithering-sine-wave","liveMaterialId":"paper-dithering-sine-wave","mode":"shader","name":"Dithering · Sine Wave","previewUrl":"/shader-previews/paper-dithering-sine-wave.webp","source":{"license":"Paper · Apache-2.0","name":"Paper Shaders","url":"https://github.com/paper-design/shaders"}},{"category":"Metal","description":"Image refraction through animated fluted and folded glass. Paper’s Abstract preset.","id":"shader-paper-fluted-glass-abstract","liveMaterialId":"paper-fluted-glass-abstract","mode":"shader","name":"Fluted Glass · Abstract","previewUrl":"/shader-previews/paper-fluted-glass-abstract.webp","source":{"license":"Paper · Apache-2.0","name":"Paper Shaders","url":"https://github.com/paper-design/shaders"}},{"category":"Fluid","description":"Ordered GPU dithering over animated procedural fields. Paper’s Swirl preset.","id":"shader-paper-dithering-swirl","liveMaterialId":"paper-dithering-swirl","mode":"shader","name":"Dithering · Swirl","previewUrl":"/shader-previews/paper-dithering-swirl.webp","source":{"license":"Paper · Apache-2.0","name":"Paper Shaders","url":"https://github.com/paper-design/shaders"}},{"category":"Metal","description":"Image refraction through animated fluted and folded glass. Paper’s Folds preset.","id":"shader-paper-fluted-glass-folds","liveMaterialId":"paper-fluted-glass-folds","mode":"shader","name":"Fluted Glass · Folds","previewUrl":"/shader-previews/paper-fluted-glass-folds.webp","source":{"license":"Paper · Apache-2.0","name":"Paper Shaders","url":"https://github.com/paper-design/shaders"}},{"category":"Fluid","description":"Ordered GPU dithering over animated procedural fields. Paper’s Warp preset.","id":"shader-paper-dithering-warp","liveMaterialId":"paper-dithering-warp","mode":"shader","name":"Dithering · Warp","previewUrl":"/shader-previews/paper-dithering-warp.webp","source":{"license":"Paper · Apache-2.0","name":"Paper Shaders","url":"https://github.com/paper-design/shaders"}},{"category":"Metal","description":"Image refraction through animated fluted and folded glass. Paper’s Waves preset.","id":"shader-paper-fluted-glass-waves","liveMaterialId":"paper-fluted-glass-waves","mode":"shader","name":"Fluted Glass · Waves","previewUrl":"/shader-previews/paper-fluted-glass-waves.webp","source":{"license":"Paper · Apache-2.0","name":"Paper Shaders","url":"https://github.com/paper-design/shaders"}},{"category":"Light","description":"Animated trail effect that tracks cursor movement · Interactive","id":"shader-shader-effects-cursor-trail","liveMaterialId":"shader-effects-cursor-trail","mode":"shader","name":"Cursor Trail","previewUrl":"/shader-previews/shader-effects-cursor-trail.webp","source":{"license":"Shaders.com · MIT","name":"Shaders.com WebGPU","url":"https://github.com/shader-effects-inc/shaders"}},{"category":"Gradient","description":"Five individually placed color points blended together by proximity — drag each point to shape the gradient · Textures","id":"shader-shader-effects-multi-point-gradient","liveMaterialId":"shader-effects-multi-point-gradient","mode":"shader","name":"Multi Point Gradient","previewUrl":"/shader-previews/shader-effects-multi-point-gradient.webp","source":{"license":"Shaders.com · MIT","name":"Shaders.com WebGPU","url":"https://github.com/shader-effects-inc/shaders"}},{"category":"Gradient","description":"Audio-visualizer waveform — equalizer bars, a filled wave, an oscilloscope line, or a dot matrix — driven by a simulated signal whose amplitude you can map to your own audio level · Textures","id":"shader-shader-effects-waveform","liveMaterialId":"shader-effects-waveform","mode":"shader","name":"Waveform","previewUrl":"/shader-previews/shader-effects-waveform.webp","source":{"license":"Shaders.com · MIT","name":"Shaders.com WebGPU","url":"https://github.com/shader-effects-inc/shaders"}},{"category":"Light","description":"Radial sunburst rays emanating from a center point · Textures","id":"shader-shader-effects-sun-burst","liveMaterialId":"shader-effects-sun-burst","mode":"shader","name":"Sun Burst","previewUrl":"/shader-previews/shader-effects-sun-burst.webp","source":{"license":"Shaders.com · MIT","name":"Shaders.com WebGPU","url":"https://github.com/shader-effects-inc/shaders"}},{"category":"Metal","description":"Photorealistic woven carbon fibre — interlaced tows whose anisotropic sheen flips ninety degrees cell to cell, raised into a quilted weave and finished with a glossy clearcoat that mirrors the studio. Plain or twill, in any shape. · Shape Effects","id":"shader-shader-effects-carbon-fiber","liveMaterialId":"shader-effects-carbon-fiber","mode":"shader","name":"Carbon Fiber","previewUrl":"/shader-previews/shader-effects-carbon-fiber.webp","source":{"license":"Shaders.com · MIT","name":"Shaders.com WebGPU","url":"https://github.com/shader-effects-inc/shaders"}},{"category":"Gradient","description":"Thermal-camera heat flowing through any 2D, SVG, or 3D shape. Powered by Paper Shaders. · Shape Effects","id":"shader-shader-effects-heatmap","liveMaterialId":"shader-effects-heatmap","mode":"shader","name":"Heatmap","previewUrl":"/shader-previews/shader-effects-heatmap.webp","source":{"license":"Shaders.com · MIT","name":"Shaders.com WebGPU","url":"https://github.com/shader-effects-inc/shaders"}},{"category":"Fluid","description":"Swirling divergence-free flow field that drifts over time · Textures","id":"shader-shader-effects-curl-noise","liveMaterialId":"shader-effects-curl-noise","mode":"shader","name":"Curl Noise","previewUrl":"/shader-previews/shader-effects-curl-noise.webp","source":{"license":"Shaders.com · MIT","name":"Shaders.com WebGPU","url":"https://github.com/shader-effects-inc/shaders"}},{"category":"Gradient","description":"Cellular pattern where each pixel is colored by its distance to the nearest of many scattered points · Textures","id":"shader-shader-effects-voronoi","liveMaterialId":"shader-effects-voronoi","mode":"shader","name":"Voronoi","previewUrl":"/shader-previews/shader-effects-voronoi.webp","source":{"license":"Shaders.com · MIT","name":"Shaders.com WebGPU","url":"https://github.com/shader-effects-inc/shaders"}},{"category":"Fluid","description":"Concentric animated ripples emanating from a point · Textures","id":"shader-shader-effects-ripples","liveMaterialId":"shader-effects-ripples","mode":"shader","name":"Ripples","previewUrl":"/shader-previews/shader-effects-ripples.webp","source":{"license":"Shaders.com · MIT","name":"Shaders.com WebGPU","url":"https://github.com/shader-effects-inc/shaders"}},{"category":"Gradient","description":"Colors sweep in a full circle around a center point, like a color wheel · Textures","id":"shader-shader-effects-conic-gradient","liveMaterialId":"shader-effects-conic-gradient","mode":"shader","name":"Conic Gradient","previewUrl":"/shader-previews/shader-effects-conic-gradient.webp","source":{"license":"Shaders.com · MIT","name":"Shaders.com WebGPU","url":"https://github.com/shader-effects-inc/shaders"}},{"category":"Graphic","description":"Rebuild any shape out of voxels — a flat shape becomes chunky pixel art, a 3D shape a lit voxel model with smooth ambient occlusion, cast shadows, a key light you can orbit or drive, and per-cube color · Shape Effects","id":"shader-shader-effects-voxels","liveMaterialId":"shader-effects-voxels","mode":"shader","name":"Voxels","previewUrl":"/shader-previews/shader-effects-voxels.webp","source":{"license":"Shaders.com · MIT","name":"Shaders.com WebGPU","url":"https://github.com/shader-effects-inc/shaders"}},{"category":"Fluid","description":"A swarm of simulated particles that settles into the shape, filling it evenly — flat, SVG or true 3D volumes — scattering from the cursor (or chasing it), tumbling when the shape moves, and always drifting back home · Shape Effects","id":"shader-shader-effects-particles","liveMaterialId":"shader-effects-particles","mode":"shader","name":"Particles","previewUrl":"/shader-previews/shader-effects-particles.webp","source":{"license":"Shaders.com · MIT","name":"Shaders.com WebGPU","url":"https://github.com/shader-effects-inc/shaders"}},{"category":"Light","description":"Drifting, twinkling motes — thousands of real simulated particles floating in a shared heading with per-particle wander and variance, and a cursor that stirs the field with a gust that settles back into the drift · Textures","id":"shader-shader-effects-floating-particles","liveMaterialId":"shader-effects-floating-particles","mode":"shader","name":"Floating Particles","previewUrl":"/shader-previews/shader-effects-floating-particles.webp","source":{"license":"Shaders.com · MIT","name":"Shaders.com WebGPU","url":"https://github.com/shader-effects-inc/shaders"}},{"category":"Light","description":"Directional falling lines with a leading-to-trailing color fade · Textures","id":"shader-shader-effects-falling-lines","liveMaterialId":"shader-effects-falling-lines","mode":"shader","name":"Falling Lines","previewUrl":"/shader-previews/shader-effects-falling-lines.webp","source":{"license":"Shaders.com · MIT","name":"Shaders.com WebGPU","url":"https://github.com/shader-effects-inc/shaders"}},{"category":"Gradient","description":"Multi-octave fractal Brownian motion noise texture with true noise evolution · Textures","id":"shader-shader-effects-fractal-noise","liveMaterialId":"shader-effects-fractal-noise","mode":"shader","name":"Fractal Noise","previewUrl":"/shader-previews/shader-effects-fractal-noise.webp","source":{"license":"Shaders.com · MIT","name":"Shaders.com WebGPU","url":"https://github.com/shader-effects-inc/shaders"}},{"category":"Gradient","description":"Branching, hydraulic-erosion ridges carved into noise · Textures","id":"shader-shader-effects-erosion-noise","liveMaterialId":"shader-effects-erosion-noise","mode":"shader","name":"Erosion Noise","previewUrl":"/shader-previews/shader-effects-erosion-noise.webp","source":{"license":"Shaders.com · MIT","name":"Shaders.com WebGPU","url":"https://github.com/shader-effects-inc/shaders"}},{"category":"Light","description":"A beam of light from one point to another. · Textures","id":"shader-shader-effects-beam","liveMaterialId":"shader-effects-beam","mode":"shader","name":"Beam","previewUrl":"/shader-previews/shader-effects-beam.webp","source":{"license":"Shaders.com · MIT","name":"Shaders.com WebGPU","url":"https://github.com/shader-effects-inc/shaders"}},{"category":"Graphic","description":"Animated Voronoi cells with controllable glow, gaps, and distortion. Paper’s Default preset.","id":"shader-paper-voronoi","liveMaterialId":"paper-voronoi","mode":"shader","name":"Voronoi","previewUrl":"/shader-previews/paper-voronoi.webp","source":{"license":"Paper · Apache-2.0","name":"Paper Shaders","url":"https://github.com/paper-design/shaders"}},{"category":"Graphic","description":"A tapered procedural spiral with controllable noise and softness. Paper’s Default preset.","id":"shader-paper-spiral","liveMaterialId":"paper-spiral","mode":"shader","name":"Spiral","previewUrl":"/shader-previews/paper-spiral.webp","source":{"license":"Paper · Apache-2.0","name":"Paper Shaders","url":"https://github.com/paper-design/shaders"}},{"category":"Graphic","description":"Animated Voronoi cells with controllable glow, gaps, and distortion. Paper’s Bubbles preset.","id":"shader-paper-voronoi-bubbles","liveMaterialId":"paper-voronoi-bubbles","mode":"shader","name":"Voronoi · Bubbles","previewUrl":"/shader-previews/paper-voronoi-bubbles.webp","source":{"license":"Paper · Apache-2.0","name":"Paper Shaders","url":"https://github.com/paper-design/shaders"}},{"category":"Graphic","description":"A tapered procedural spiral with controllable noise and softness. Paper’s Droplet preset.","id":"shader-paper-spiral-droplet","liveMaterialId":"paper-spiral-droplet","mode":"shader","name":"Spiral · Droplet","previewUrl":"/shader-previews/paper-spiral-droplet.webp","source":{"license":"Paper · Apache-2.0","name":"Paper Shaders","url":"https://github.com/paper-design/shaders"}},{"category":"Graphic","description":"Animated Voronoi cells with controllable glow, gaps, and distortion. Paper’s Cells preset.","id":"shader-paper-voronoi-cells","liveMaterialId":"paper-voronoi-cells","mode":"shader","name":"Voronoi · Cells","previewUrl":"/shader-previews/paper-voronoi-cells.webp","source":{"license":"Paper · Apache-2.0","name":"Paper Shaders","url":"https://github.com/paper-design/shaders"}},{"category":"Graphic","description":"A tapered procedural spiral with controllable noise and softness. Paper’s Jungle preset.","id":"shader-paper-spiral-jungle","liveMaterialId":"paper-spiral-jungle","mode":"shader","name":"Spiral · Jungle","previewUrl":"/shader-previews/paper-spiral-jungle.webp","source":{"license":"Paper · Apache-2.0","name":"Paper Shaders","url":"https://github.com/paper-design/shaders"}},{"category":"Graphic","description":"Animated Voronoi cells with controllable glow, gaps, and distortion. Paper’s Lights preset.","id":"shader-paper-voronoi-lights","liveMaterialId":"paper-voronoi-lights","mode":"shader","name":"Voronoi · Lights","previewUrl":"/shader-previews/paper-voronoi-lights.webp","source":{"license":"Paper · Apache-2.0","name":"Paper Shaders","url":"https://github.com/paper-design/shaders"}},{"category":"Fluid","description":"A tapered procedural spiral with controllable noise and softness. Paper’s Swirl preset.","id":"shader-paper-spiral-swirl","liveMaterialId":"paper-spiral-swirl","mode":"shader","name":"Spiral · Swirl","previewUrl":"/shader-previews/paper-spiral-swirl.webp","source":{"license":"Paper · Apache-2.0","name":"Paper Shaders","url":"https://github.com/paper-design/shaders"}},{"category":"Light","description":"A luminous animated perimeter with flexible shape and energy falloff. Paper’s Default preset.","id":"shader-paper-pulsing-border","liveMaterialId":"paper-pulsing-border","mode":"shader","name":"Pulsing Border","previewUrl":"/shader-previews/paper-pulsing-border.webp","source":{"license":"Paper · Apache-2.0","name":"Paper Shaders","url":"https://github.com/paper-design/shaders"}},{"category":"Gradient","description":"Cellular noise field — distance-based, with selectable feature combinations and fractal octaves · Textures","id":"shader-shader-effects-worley-noise","liveMaterialId":"shader-effects-worley-noise","mode":"shader","name":"Worley Noise","previewUrl":"/shader-previews/shader-effects-worley-noise.webp","source":{"license":"Shaders.com · MIT","name":"Shaders.com WebGPU","url":"https://github.com/shader-effects-inc/shaders"}},{"category":"Light","description":"A luminous animated perimeter with flexible shape and energy falloff. Paper’s Circle preset.","id":"shader-paper-pulsing-border-circle","liveMaterialId":"paper-pulsing-border-circle","mode":"shader","name":"Pulsing Border · Circle","previewUrl":"/shader-previews/paper-pulsing-border-circle.webp","source":{"license":"Paper · Apache-2.0","name":"Paper Shaders","url":"https://github.com/paper-design/shaders"}},{"category":"Graphic","description":"Isometric tumbling-blocks tiling — a 3D cube illusion (rhombille pattern) · Textures","id":"shader-shader-effects-isometric-cubes","liveMaterialId":"shader-effects-isometric-cubes","mode":"shader","name":"Isometric Cubes","previewUrl":"/shader-previews/shader-effects-isometric-cubes.webp","source":{"license":"Shaders.com · MIT","name":"Shaders.com WebGPU","url":"https://github.com/shader-effects-inc/shaders"}},{"category":"Light","description":"A luminous animated perimeter with flexible shape and energy falloff. Paper’s Northern lights preset.","id":"shader-paper-pulsing-border-northern-lights","liveMaterialId":"paper-pulsing-border-northern-lights","mode":"shader","name":"Pulsing Border · Northern lights","previewUrl":"/shader-previews/paper-pulsing-border-northern-lights.webp","source":{"license":"Paper · Apache-2.0","name":"Paper Shaders","url":"https://github.com/paper-design/shaders"}},{"category":"Graphic","description":"Quarter-circle arc tiles that connect to form organic, maze-like flowing curves · Textures","id":"shader-shader-effects-truchet","liveMaterialId":"shader-effects-truchet","mode":"shader","name":"Truchet","previewUrl":"/shader-previews/shader-effects-truchet.webp","source":{"license":"Shaders.com · MIT","name":"Shaders.com WebGPU","url":"https://github.com/shader-effects-inc/shaders"}},{"category":"Light","description":"A luminous animated perimeter with flexible shape and energy falloff. Paper’s Solid line preset.","id":"shader-paper-pulsing-border-solid-line","liveMaterialId":"paper-pulsing-border-solid-line","mode":"shader","name":"Pulsing Border · Solid line","previewUrl":"/shader-previews/paper-pulsing-border-solid-line.webp","source":{"license":"Paper · Apache-2.0","name":"Paper Shaders","url":"https://github.com/paper-design/shaders"}},{"category":"Graphic","description":"Interlaced textile weave pattern with two thread colors going over and under each other · Textures","id":"shader-shader-effects-weave","liveMaterialId":"shader-effects-weave","mode":"shader","name":"Weave","previewUrl":"/shader-previews/shader-effects-weave.webp","source":{"license":"Shaders.com · MIT","name":"Shaders.com WebGPU","url":"https://github.com/shader-effects-inc/shaders"}},{"category":"Graphic","description":"Rotating spiral pattern with animated movement · Textures","id":"shader-shader-effects-spiral","liveMaterialId":"shader-effects-spiral","mode":"shader","name":"Spiral","previewUrl":"/shader-previews/shader-effects-spiral.webp","source":{"license":"Shaders.com · MIT","name":"Shaders.com WebGPU","url":"https://github.com/shader-effects-inc/shaders"}},{"category":"Graphic","description":"Fine hairline scratches, like a worn film or scratched surface · Textures","id":"shader-shader-effects-scratches","liveMaterialId":"shader-effects-scratches","mode":"shader","name":"Scratches","previewUrl":"/shader-previews/shader-effects-scratches.webp","source":{"license":"Shaders.com · MIT","name":"Shaders.com WebGPU","url":"https://github.com/shader-effects-inc/shaders"}},{"category":"Graphic","description":"Animated wave with thickness and softness · Textures","id":"shader-shader-effects-sine-wave","liveMaterialId":"shader-effects-sine-wave","mode":"shader","name":"Sine Wave","previewUrl":"/shader-previews/shader-effects-sine-wave.webp","source":{"license":"Shaders.com · MIT","name":"Shaders.com WebGPU","url":"https://github.com/shader-effects-inc/shaders"}},{"category":"Gradient","description":"Orbiting color particles with soft depth and luminous motion. Paper’s Default preset.","id":"shader-paper-dot-orbit","liveMaterialId":"paper-dot-orbit","mode":"shader","name":"Dot Orbit","previewUrl":"/shader-previews/paper-dot-orbit.webp","source":{"license":"Paper · Apache-2.0","name":"Paper Shaders","url":"https://github.com/paper-design/shaders"}},{"category":"Graphic","description":"Procedural fibers, folds, crumples, and tactile paper grain. Paper’s Default preset.","id":"shader-paper-paper-texture","liveMaterialId":"paper-paper-texture","mode":"shader","name":"Paper Texture","previewUrl":"/shader-previews/paper-paper-texture.webp","source":{"license":"Paper · Apache-2.0","name":"Paper Shaders","url":"https://github.com/paper-design/shaders"}},{"category":"Gradient","description":"Orbiting color particles with soft depth and luminous motion. Paper’s Bubbles preset.","id":"shader-paper-dot-orbit-bubbles","liveMaterialId":"paper-dot-orbit-bubbles","mode":"shader","name":"Dot Orbit · Bubbles","previewUrl":"/shader-previews/paper-dot-orbit-bubbles.webp","source":{"license":"Paper · Apache-2.0","name":"Paper Shaders","url":"https://github.com/paper-design/shaders"}},{"category":"Graphic","description":"Procedural fibers, folds, crumples, and tactile paper grain. Paper’s Abstract preset.","id":"shader-paper-paper-texture-abstract","liveMaterialId":"paper-paper-texture-abstract","mode":"shader","name":"Paper Texture · Abstract","previewUrl":"/shader-previews/paper-paper-texture-abstract.webp","source":{"license":"Paper · Apache-2.0","name":"Paper Shaders","url":"https://github.com/paper-design/shaders"}},{"category":"Gradient","description":"Orbiting color particles with soft depth and luminous motion. Paper’s Hallucinatory preset.","id":"shader-paper-dot-orbit-hallucinatory","liveMaterialId":"paper-dot-orbit-hallucinatory","mode":"shader","name":"Dot Orbit · Hallucinatory","previewUrl":"/shader-previews/paper-dot-orbit-hallucinatory.webp","source":{"license":"Paper · Apache-2.0","name":"Paper Shaders","url":"https://github.com/paper-design/shaders"}},{"category":"Graphic","description":"Procedural fibers, folds, crumples, and tactile paper grain. Paper’s Cardboard preset.","id":"shader-paper-paper-texture-cardboard","liveMaterialId":"paper-paper-texture-cardboard","mode":"shader","name":"Paper Texture · Cardboard","previewUrl":"/shader-previews/paper-paper-texture-cardboard.webp","source":{"license":"Paper · Apache-2.0","name":"Paper Shaders","url":"https://github.com/paper-design/shaders"}},{"category":"Gradient","description":"Orbiting color particles with soft depth and luminous motion. Paper’s Shine preset.","id":"shader-paper-dot-orbit-shine","liveMaterialId":"paper-dot-orbit-shine","mode":"shader","name":"Dot Orbit · Shine","previewUrl":"/shader-previews/paper-dot-orbit-shine.webp","source":{"license":"Paper · Apache-2.0","name":"Paper Shaders","url":"https://github.com/paper-design/shaders"}},{"category":"Graphic","description":"Procedural fibers, folds, crumples, and tactile paper grain. Paper’s Details preset.","id":"shader-paper-paper-texture-details","liveMaterialId":"paper-paper-texture-details","mode":"shader","name":"Paper Texture · Details","previewUrl":"/shader-previews/paper-paper-texture-details.webp","source":{"license":"Paper · Apache-2.0","name":"Paper Shaders","url":"https://github.com/paper-design/shaders"}},{"category":"Graphic","description":"A directional gradient that smoothly cycles through rainbow colors or a custom set of three colors · Textures","id":"shader-shader-effects-color-wheel","liveMaterialId":"shader-effects-color-wheel","mode":"shader","name":"Color Wheel","previewUrl":"/shader-previews/shader-effects-color-wheel.webp","source":{"license":"Shaders.com · MIT","name":"Shaders.com WebGPU","url":"https://github.com/shader-effects-inc/shaders"}},{"category":"Graphic","description":"Tiling grid of equilateral triangles with optional animated row offsets · Textures","id":"shader-shader-effects-triangular-grid","liveMaterialId":"shader-effects-triangular-grid","mode":"shader","name":"Triangular Grid","previewUrl":"/shader-previews/shader-effects-triangular-grid.webp","source":{"license":"Shaders.com · MIT","name":"Shaders.com WebGPU","url":"https://github.com/shader-effects-inc/shaders"}},{"category":"Graphic","description":"Honeycomb hexagonal grid pattern · Textures","id":"shader-shader-effects-hex-grid","liveMaterialId":"shader-effects-hex-grid","mode":"shader","name":"Hex Grid","previewUrl":"/shader-previews/shader-effects-hex-grid.webp","source":{"license":"Shaders.com · MIT","name":"Shaders.com WebGPU","url":"https://github.com/shader-effects-inc/shaders"}},{"category":"Graphic","description":"Grid of dots with optional twinkling animation · Textures","id":"shader-shader-effects-dot-grid","liveMaterialId":"shader-effects-dot-grid","mode":"shader","name":"Dot Grid","previewUrl":"/shader-previews/shader-effects-dot-grid.webp","source":{"license":"Shaders.com · MIT","name":"Shaders.com WebGPU","url":"https://github.com/shader-effects-inc/shaders"}},{"category":"Graphic","description":"Classic brick wall pattern with alternating rows and mortar gaps · Textures","id":"shader-shader-effects-brick-pattern","liveMaterialId":"shader-effects-brick-pattern","mode":"shader","name":"Brick Pattern","previewUrl":"/shader-previews/shader-effects-brick-pattern.webp","source":{"license":"Shaders.com · MIT","name":"Shaders.com WebGPU","url":"https://github.com/shader-effects-inc/shaders"}},{"category":"Graphic","description":"Animated chevron / zigzag stripe pattern · Textures","id":"shader-shader-effects-chevron","liveMaterialId":"shader-effects-chevron","mode":"shader","name":"Chevron","previewUrl":"/shader-previews/shader-effects-chevron.webp","source":{"license":"Shaders.com · MIT","name":"Shaders.com WebGPU","url":"https://github.com/shader-effects-inc/shaders"}},{"category":"Graphic","description":"Alternating colored stripes with animation · Textures","id":"shader-shader-effects-stripes","liveMaterialId":"shader-effects-stripes","mode":"shader","name":"Stripes","previewUrl":"/shader-previews/shader-effects-stripes.webp","source":{"license":"Shaders.com · MIT","name":"Shaders.com WebGPU","url":"https://github.com/shader-effects-inc/shaders"}},{"category":"Graphic","description":"Blocky value noise with soft cells that morph over time · Textures","id":"shader-shader-effects-block-noise","liveMaterialId":"shader-effects-block-noise","mode":"shader","name":"Block Noise","previewUrl":"/shader-previews/shader-effects-block-noise.webp","source":{"license":"Shaders.com · MIT","name":"Shaders.com WebGPU","url":"https://github.com/shader-effects-inc/shaders"}},{"category":"Graphic","description":"High-frequency blue noise — even, grainy speckle ideal for dithering · Textures","id":"shader-shader-effects-blue-noise","liveMaterialId":"shader-effects-blue-noise","mode":"shader","name":"Blue Noise","previewUrl":"/shader-previews/shader-effects-blue-noise.webp","source":{"license":"Shaders.com · MIT","name":"Shaders.com WebGPU","url":"https://github.com/shader-effects-inc/shaders"}},{"category":"Graphic","description":"A graphic dot lattice animated through geometric fields. Paper’s Default preset.","id":"shader-paper-dot-grid","liveMaterialId":"paper-dot-grid","mode":"shader","name":"Dot Grid","previewUrl":"/shader-previews/paper-dot-grid.webp","source":{"license":"Paper · Apache-2.0","name":"Paper Shaders","url":"https://github.com/paper-design/shaders"}},{"category":"Light","description":"Image-aware ordered dithering with graphic color separation. Paper’s Default preset.","id":"shader-paper-image-dithering","liveMaterialId":"paper-image-dithering","mode":"shader","name":"Image Dithering","previewUrl":"/shader-previews/paper-image-dithering.webp","source":{"license":"Paper · Apache-2.0","name":"Paper Shaders","url":"https://github.com/paper-design/shaders"}},{"category":"Light","description":"A graphic dot lattice animated through geometric fields. Paper’s Tree line preset.","id":"shader-paper-dot-grid-tree-line","liveMaterialId":"paper-dot-grid-tree-line","mode":"shader","name":"Dot Grid · Tree line","previewUrl":"/shader-previews/paper-dot-grid-tree-line.webp","source":{"license":"Paper · Apache-2.0","name":"Paper Shaders","url":"https://github.com/paper-design/shaders"}},{"category":"Light","description":"Image-aware ordered dithering with graphic color separation. Paper’s Natural preset.","id":"shader-paper-image-dithering-natural","liveMaterialId":"paper-image-dithering-natural","mode":"shader","name":"Image Dithering · Natural","previewUrl":"/shader-previews/paper-image-dithering-natural.webp","source":{"license":"Paper · Apache-2.0","name":"Paper Shaders","url":"https://github.com/paper-design/shaders"}},{"category":"Graphic","description":"A graphic dot lattice animated through geometric fields. Paper’s Triangles preset.","id":"shader-paper-dot-grid-triangles","liveMaterialId":"paper-dot-grid-triangles","mode":"shader","name":"Dot Grid · Triangles","previewUrl":"/shader-previews/paper-dot-grid-triangles.webp","source":{"license":"Paper · Apache-2.0","name":"Paper Shaders","url":"https://github.com/paper-design/shaders"}},{"category":"Light","description":"Image-aware ordered dithering with graphic color separation. Paper’s Noise preset.","id":"shader-paper-image-dithering-noise","liveMaterialId":"paper-image-dithering-noise","mode":"shader","name":"Image Dithering · Noise","previewUrl":"/shader-previews/paper-image-dithering-noise.webp","source":{"license":"Paper · Apache-2.0","name":"Paper Shaders","url":"https://github.com/paper-design/shaders"}},{"category":"Graphic","description":"A graphic dot lattice animated through geometric fields. Paper’s Wallpaper preset.","id":"shader-paper-dot-grid-wallpaper","liveMaterialId":"paper-dot-grid-wallpaper","mode":"shader","name":"Dot Grid · Wallpaper","previewUrl":"/shader-previews/paper-dot-grid-wallpaper.webp","source":{"license":"Paper · Apache-2.0","name":"Paper Shaders","url":"https://github.com/paper-design/shaders"}},{"category":"Light","description":"Image-aware ordered dithering with graphic color separation. Paper’s Retro preset.","id":"shader-paper-image-dithering-retro","liveMaterialId":"paper-image-dithering-retro","mode":"shader","name":"Image Dithering · Retro","previewUrl":"/shader-previews/paper-image-dithering-retro.webp","source":{"license":"Paper · Apache-2.0","name":"Paper Shaders","url":"https://github.com/paper-design/shaders"}},{"category":"Graphic","description":"Image-driven halftone dots with tactile print texture. Paper’s Default preset.","id":"shader-paper-halftone-dots","liveMaterialId":"paper-halftone-dots","mode":"shader","name":"Halftone Dots","previewUrl":"/shader-previews/paper-halftone-dots.webp","source":{"license":"Paper · Apache-2.0","name":"Paper Shaders","url":"https://github.com/paper-design/shaders"}},{"category":"Graphic","description":"Layered cyan, magenta, yellow, and black print screening. Paper’s Default preset.","id":"shader-paper-halftone-cmyk","liveMaterialId":"paper-halftone-cmyk","mode":"shader","name":"Halftone CMYK","previewUrl":"/shader-previews/paper-halftone-cmyk.webp","source":{"license":"Paper · Apache-2.0","name":"Paper Shaders","url":"https://github.com/paper-design/shaders"}},{"category":"Graphic","description":"Image-driven halftone dots with tactile print texture. Paper’s LED screen preset.","id":"shader-paper-halftone-dots-led-screen","liveMaterialId":"paper-halftone-dots-led-screen","mode":"shader","name":"Halftone Dots · LED screen","previewUrl":"/shader-previews/paper-halftone-dots-led-screen.webp","source":{"license":"Paper · Apache-2.0","name":"Paper Shaders","url":"https://github.com/paper-design/shaders"}},{"category":"Graphic","description":"Layered cyan, magenta, yellow, and black print screening. Paper’s Drops preset.","id":"shader-paper-halftone-cmyk-drops","liveMaterialId":"paper-halftone-cmyk-drops","mode":"shader","name":"Halftone CMYK · Drops","previewUrl":"/shader-previews/paper-halftone-cmyk-drops.webp","source":{"license":"Paper · Apache-2.0","name":"Paper Shaders","url":"https://github.com/paper-design/shaders"}},{"category":"Graphic","description":"Image-driven halftone dots with tactile print texture. Paper’s Mosaic preset.","id":"shader-paper-halftone-dots-mosaic","liveMaterialId":"paper-halftone-dots-mosaic","mode":"shader","name":"Halftone Dots · Mosaic","previewUrl":"/shader-previews/paper-halftone-dots-mosaic.webp","source":{"license":"Paper · Apache-2.0","name":"Paper Shaders","url":"https://github.com/paper-design/shaders"}},{"category":"Graphic","description":"Layered cyan, magenta, yellow, and black print screening. Paper’s Newspaper preset.","id":"shader-paper-halftone-cmyk-newspaper","liveMaterialId":"paper-halftone-cmyk-newspaper","mode":"shader","name":"Halftone CMYK · Newspaper","previewUrl":"/shader-previews/paper-halftone-cmyk-newspaper.webp","source":{"license":"Paper · Apache-2.0","name":"Paper Shaders","url":"https://github.com/paper-design/shaders"}},{"category":"Graphic","description":"Image-driven halftone dots with tactile print texture. Paper’s Round and square preset.","id":"shader-paper-halftone-dots-round-and-square","liveMaterialId":"paper-halftone-dots-round-and-square","mode":"shader","name":"Halftone Dots · Round and square","previewUrl":"/shader-previews/paper-halftone-dots-round-and-square.webp","source":{"license":"Paper · Apache-2.0","name":"Paper Shaders","url":"https://github.com/paper-design/shaders"}},{"category":"Graphic","description":"Layered cyan, magenta, yellow, and black print screening. Paper’s Vintage preset.","id":"shader-paper-halftone-cmyk-vintage","liveMaterialId":"paper-halftone-cmyk-vintage","mode":"shader","name":"Halftone CMYK · Vintage","previewUrl":"/shader-previews/paper-halftone-cmyk-vintage.webp","source":{"license":"Paper · Apache-2.0","name":"Paper Shaders","url":"https://github.com/paper-design/shaders"}},{"category":"Graphic","description":"Classic checkerboard pattern with two alternating colors · Textures","id":"shader-shader-effects-checkerboard","liveMaterialId":"shader-effects-checkerboard","mode":"shader","name":"Checkerboard","previewUrl":"/shader-previews/shader-effects-checkerboard.webp","source":{"license":"Shaders.com · MIT","name":"Shaders.com WebGPU","url":"https://github.com/shader-effects-inc/shaders"}},{"category":"Graphic","description":"Simple grid lines pattern with adjustable thickness and rotation · Textures","id":"shader-shader-effects-grid","liveMaterialId":"shader-effects-grid","mode":"shader","name":"Grid","previewUrl":"/shader-previews/shader-effects-grid.webp","source":{"license":"Shaders.com · MIT","name":"Shaders.com WebGPU","url":"https://github.com/shader-effects-inc/shaders"}}],"openPbrAssets":[{"category":"Textile","description":"Photoreal velvet pile with anisotropic sheen and full PBR response.","fallbackMaterial":"felted-wool","id":"polyhaven-velour-velvet","mapNames":{"color":"diff","displacement":"disp","normal":"nor_gl","roughness":"rough","metalness":"metal"},"name":"Velour velvet","settings":{"surfaceDepth":24,"surfaceMaterial":"felted-wool","surfaceMetallic":0,"surfaceRoughness":82,"surfaceScale":30,"surfaceTextureAmount":92},"sourceAssetId":"velour_velvet","license":"CC0 1.0","normalFormat":"opengl","provider":"Poly Haven","sourceUrl":"https://polyhaven.com/a/velour_velvet","thumbnailUrl":"https://cdn.polyhaven.com/asset_img/thumbs/velour_velvet.png?width=384&height=256"},{"category":"Textile","description":"Scanned rough fabric with real color, displacement, normal, roughness, and occlusion maps.","fallbackMaterial":"linen-weave","id":"ambientcg-fabric-061","mapNames":{"color":"Color","displacement":"Displacement","normal":"NormalDX","roughness":"Roughness"},"name":"Rough woven fabric","settings":{"surfaceDepth":40,"surfaceMaterial":"linen-weave","surfaceMetallic":0,"surfaceRoughness":90,"surfaceScale":34,"surfaceTextureAmount":100},"sourceAssetId":"Fabric061","license":"CC0 1.0","normalFormat":"directx","provider":"ambientCG","sourceUrl":"https://ambientcg.com/a/Fabric061","thumbnailUrl":"https://acg-media.struffelproductions.com/file/ambientCG-Web/media/thumbnail/512-WEBP/Fabric061.webp"},{"category":"Leather","description":"Dark natural leather scan with genuine grain height and roughness maps.","fallbackMaterial":"pebbled-leather","id":"ambientcg-leather-037","mapNames":{"color":"Color","displacement":"Displacement","normal":"NormalDX","roughness":"Roughness"},"name":"Dark leather","settings":{"surfaceDepth":48,"surfaceMaterial":"pebbled-leather","surfaceMetallic":0,"surfaceRoughness":58,"surfaceScale":38,"surfaceTextureAmount":100},"sourceAssetId":"Leather037","license":"CC0 1.0","normalFormat":"directx","provider":"ambientCG","sourceUrl":"https://ambientcg.com/a/Leather037","thumbnailUrl":"https://acg-media.struffelproductions.com/file/ambientCG-Web/media/thumbnail/512-WEBP/Leather037.webp"},{"category":"Wood","description":"Clean oak veneer scan with fine longitudinal grain and measured surface maps.","fallbackMaterial":"kerf-wood","id":"polyhaven-oak-veneer","mapNames":{"color":"diff","displacement":"disp","normal":"nor_gl","roughness":"rough"},"name":"Oak veneer","settings":{"surfaceAngle":0,"surfaceDepth":34,"surfaceMaterial":"kerf-wood","surfaceMetallic":0,"surfaceRoughness":54,"surfaceScale":70,"surfaceTextureAmount":96},"sourceAssetId":"oak_veneer_01","license":"CC0 1.0","normalFormat":"opengl","provider":"Poly Haven","sourceUrl":"https://polyhaven.com/a/oak_veneer_01","thumbnailUrl":"https://cdn.polyhaven.com/asset_img/thumbs/oak_veneer_01.png?width=384&height=256"},{"category":"Wood","description":"Layered plywood with real end-grain variation and a restrained matte response.","fallbackMaterial":"kerf-wood","id":"polyhaven-plywood","mapNames":{"color":"diff","displacement":"disp","normal":"nor_gl","roughness":"rough"},"name":"Layered plywood","settings":{"surfaceDepth":38,"surfaceMaterial":"kerf-wood","surfaceMetallic":0,"surfaceRoughness":68,"surfaceScale":74,"surfaceTextureAmount":96},"sourceAssetId":"plywood","license":"CC0 1.0","normalFormat":"opengl","provider":"Poly Haven","sourceUrl":"https://polyhaven.com/a/plywood","thumbnailUrl":"https://cdn.polyhaven.com/asset_img/thumbs/plywood.png?width=384&height=256"},{"category":"Stone","description":"Veined polished marble with real normal, displacement, and roughness maps.","fallbackMaterial":"carved-stone","id":"polyhaven-marble","mapNames":{"color":"diff","displacement":"disp","normal":"nor_gl","roughness":"rough"},"name":"Veined marble","settings":{"surfaceDepth":18,"surfaceMaterial":"carved-stone","surfaceMetallic":2,"surfaceRoughness":22,"surfaceScale":88,"surfaceTextureAmount":94},"sourceAssetId":"marble_01","license":"CC0 1.0","normalFormat":"opengl","provider":"Poly Haven","sourceUrl":"https://polyhaven.com/a/marble_01","thumbnailUrl":"https://cdn.polyhaven.com/asset_img/thumbs/marble_01.png?width=384&height=256"},{"category":"Metal","description":"Weathered industrial plate with true metalness, roughness, normal, and displacement maps.","fallbackMaterial":"brushed-metal","id":"polyhaven-metal-plate","mapNames":{"color":"diff","displacement":"disp","normal":"nor_gl","roughness":"rough","metalness":"metal"},"name":"Weathered metal plate","settings":{"surfaceDepth":36,"surfaceMaterial":"brushed-metal","surfaceMetallic":92,"surfaceRoughness":44,"surfaceScale":64,"surfaceTextureAmount":100},"sourceAssetId":"metal_plate","license":"CC0 1.0","normalFormat":"opengl","provider":"Poly Haven","sourceUrl":"https://polyhaven.com/a/metal_plate","thumbnailUrl":"https://cdn.polyhaven.com/asset_img/thumbs/metal_plate.png?width=384&height=256"},{"category":"Metal","description":"Oxidized dark steel scan with independent metalness and roughness maps.","fallbackMaterial":"hammered-foil","id":"ambientcg-metal-063","mapNames":{"color":"Color","displacement":"Displacement","normal":"NormalDX","roughness":"Roughness","metalness":"Metalness"},"name":"Oxidized steel","settings":{"surfaceDepth":44,"surfaceMaterial":"hammered-foil","surfaceMetallic":88,"surfaceRoughness":48,"surfaceScale":54,"surfaceTextureAmount":100},"sourceAssetId":"Metal063","license":"CC0 1.0","normalFormat":"directx","provider":"ambientCG","sourceUrl":"https://ambientcg.com/a/Metal063","thumbnailUrl":"https://acg-media.struffelproductions.com/file/ambientCG-Web/media/thumbnail/512-WEBP/Metal063.webp"},{"category":"Mineral","description":"Warm architectural wall plaster captured with real pore and trowel variation.","fallbackMaterial":"sandblasted-plaster","id":"polyhaven-beige-wall","mapNames":{"color":"diff","displacement":"disp","normal":"nor_gl","roughness":"rough"},"name":"Warm wall plaster","settings":{"surfaceDepth":32,"surfaceMaterial":"sandblasted-plaster","surfaceMetallic":0,"surfaceRoughness":90,"surfaceScale":58,"surfaceTextureAmount":100},"sourceAssetId":"beige_wall_001","license":"CC0 1.0","normalFormat":"opengl","provider":"Poly Haven","sourceUrl":"https://polyhaven.com/a/beige_wall_001","thumbnailUrl":"https://cdn.polyhaven.com/asset_img/thumbs/beige_wall_001.png?width=384&height=256"},{"category":"Polymer","description":"Molded rubber tile surface with real seams, shallow relief, and dry roughness.","fallbackMaterial":"corrugated-polymer","id":"polyhaven-rubber-tiles","mapNames":{"color":"diff","displacement":"disp","normal":"nor_gl","roughness":"rough"},"name":"Molded rubber tiles","settings":{"surfaceDepth":46,"surfaceMaterial":"corrugated-polymer","surfaceMetallic":0,"surfaceRoughness":82,"surfaceScale":56,"surfaceTextureAmount":100},"sourceAssetId":"rubber_tiles","license":"CC0 1.0","normalFormat":"opengl","provider":"Poly Haven","sourceUrl":"https://polyhaven.com/a/rubber_tiles","thumbnailUrl":"https://cdn.polyhaven.com/asset_img/thumbs/rubber_tiles.png?width=384&height=256"},{"category":"Paper","description":"Scanned paper fibers with measured color, height, normal, and roughness maps.","fallbackMaterial":"embossed-paper","id":"ambientcg-paper-006","mapNames":{"color":"Color","displacement":"Displacement","normal":"NormalDX","roughness":"Roughness"},"name":"Natural paper fibers","settings":{"surfaceDepth":24,"surfaceMaterial":"embossed-paper","surfaceMetallic":0,"surfaceRoughness":96,"surfaceScale":42,"surfaceTextureAmount":100},"sourceAssetId":"Paper006","license":"CC0 1.0","normalFormat":"directx","provider":"ambientCG","sourceUrl":"https://ambientcg.com/a/Paper006","thumbnailUrl":"https://acg-media.struffelproductions.com/file/ambientCG-Web/media/thumbnail/512-WEBP/Paper006.webp"}],"presets":[{"category":"Textile","description":"Photoreal velvet pile with anisotropic sheen and full PBR response.","id":"polyhaven-velour-velvet","name":"Velour velvet","previewUrl":"https://cdn.polyhaven.com/asset_img/thumbs/velour_velvet.png?width=384&height=256","settings":{"surfaceDepth":24,"surfaceMaterial":"felted-wool","surfaceMetallic":0,"surfaceRoughness":82,"surfaceScale":30,"surfaceTextureAmount":92,"surfaceLibraryAssetId":"polyhaven-velour-velvet"},"source":{"license":"CC0 1.0","name":"Poly Haven","url":"https://polyhaven.com/a/velour_velvet"}},{"category":"Textile","description":"Scanned rough fabric with real color, displacement, normal, roughness, and occlusion maps.","id":"ambientcg-fabric-061","name":"Rough woven fabric","previewUrl":"https://acg-media.struffelproductions.com/file/ambientCG-Web/media/thumbnail/512-WEBP/Fabric061.webp","settings":{"surfaceDepth":40,"surfaceMaterial":"linen-weave","surfaceMetallic":0,"surfaceRoughness":90,"surfaceScale":34,"surfaceTextureAmount":100,"surfaceLibraryAssetId":"ambientcg-fabric-061"},"source":{"license":"CC0 1.0","name":"ambientCG","url":"https://ambientcg.com/a/Fabric061"}},{"category":"Leather","description":"Dark natural leather scan with genuine grain height and roughness maps.","id":"ambientcg-leather-037","name":"Dark leather","previewUrl":"https://acg-media.struffelproductions.com/file/ambientCG-Web/media/thumbnail/512-WEBP/Leather037.webp","settings":{"surfaceDepth":48,"surfaceMaterial":"pebbled-leather","surfaceMetallic":0,"surfaceRoughness":58,"surfaceScale":38,"surfaceTextureAmount":100,"surfaceLibraryAssetId":"ambientcg-leather-037"},"source":{"license":"CC0 1.0","name":"ambientCG","url":"https://ambientcg.com/a/Leather037"}},{"category":"Wood","description":"Clean oak veneer scan with fine longitudinal grain and measured surface maps.","id":"polyhaven-oak-veneer","name":"Oak veneer","previewUrl":"https://cdn.polyhaven.com/asset_img/thumbs/oak_veneer_01.png?width=384&height=256","settings":{"surfaceAngle":0,"surfaceDepth":34,"surfaceMaterial":"kerf-wood","surfaceMetallic":0,"surfaceRoughness":54,"surfaceScale":70,"surfaceTextureAmount":96,"surfaceLibraryAssetId":"polyhaven-oak-veneer"},"source":{"license":"CC0 1.0","name":"Poly Haven","url":"https://polyhaven.com/a/oak_veneer_01"}},{"category":"Wood","description":"Layered plywood with real end-grain variation and a restrained matte response.","id":"polyhaven-plywood","name":"Layered plywood","previewUrl":"https://cdn.polyhaven.com/asset_img/thumbs/plywood.png?width=384&height=256","settings":{"surfaceDepth":38,"surfaceMaterial":"kerf-wood","surfaceMetallic":0,"surfaceRoughness":68,"surfaceScale":74,"surfaceTextureAmount":96,"surfaceLibraryAssetId":"polyhaven-plywood"},"source":{"license":"CC0 1.0","name":"Poly Haven","url":"https://polyhaven.com/a/plywood"}},{"category":"Stone","description":"Veined polished marble with real normal, displacement, and roughness maps.","id":"polyhaven-marble","name":"Veined marble","previewUrl":"https://cdn.polyhaven.com/asset_img/thumbs/marble_01.png?width=384&height=256","settings":{"surfaceDepth":18,"surfaceMaterial":"carved-stone","surfaceMetallic":2,"surfaceRoughness":22,"surfaceScale":88,"surfaceTextureAmount":94,"surfaceLibraryAssetId":"polyhaven-marble"},"source":{"license":"CC0 1.0","name":"Poly Haven","url":"https://polyhaven.com/a/marble_01"}},{"category":"Metal","description":"Weathered industrial plate with true metalness, roughness, normal, and displacement maps.","id":"polyhaven-metal-plate","name":"Weathered metal plate","previewUrl":"https://cdn.polyhaven.com/asset_img/thumbs/metal_plate.png?width=384&height=256","settings":{"surfaceDepth":36,"surfaceMaterial":"brushed-metal","surfaceMetallic":92,"surfaceRoughness":44,"surfaceScale":64,"surfaceTextureAmount":100,"surfaceLibraryAssetId":"polyhaven-metal-plate"},"source":{"license":"CC0 1.0","name":"Poly Haven","url":"https://polyhaven.com/a/metal_plate"}},{"category":"Metal","description":"Oxidized dark steel scan with independent metalness and roughness maps.","id":"ambientcg-metal-063","name":"Oxidized steel","previewUrl":"https://acg-media.struffelproductions.com/file/ambientCG-Web/media/thumbnail/512-WEBP/Metal063.webp","settings":{"surfaceDepth":44,"surfaceMaterial":"hammered-foil","surfaceMetallic":88,"surfaceRoughness":48,"surfaceScale":54,"surfaceTextureAmount":100,"surfaceLibraryAssetId":"ambientcg-metal-063"},"source":{"license":"CC0 1.0","name":"ambientCG","url":"https://ambientcg.com/a/Metal063"}},{"category":"Mineral","description":"Warm architectural wall plaster captured with real pore and trowel variation.","id":"polyhaven-beige-wall","name":"Warm wall plaster","previewUrl":"https://cdn.polyhaven.com/asset_img/thumbs/beige_wall_001.png?width=384&height=256","settings":{"surfaceDepth":32,"surfaceMaterial":"sandblasted-plaster","surfaceMetallic":0,"surfaceRoughness":90,"surfaceScale":58,"surfaceTextureAmount":100,"surfaceLibraryAssetId":"polyhaven-beige-wall"},"source":{"license":"CC0 1.0","name":"Poly Haven","url":"https://polyhaven.com/a/beige_wall_001"}},{"category":"Polymer","description":"Molded rubber tile surface with real seams, shallow relief, and dry roughness.","id":"polyhaven-rubber-tiles","name":"Molded rubber tiles","previewUrl":"https://cdn.polyhaven.com/asset_img/thumbs/rubber_tiles.png?width=384&height=256","settings":{"surfaceDepth":46,"surfaceMaterial":"corrugated-polymer","surfaceMetallic":0,"surfaceRoughness":82,"surfaceScale":56,"surfaceTextureAmount":100,"surfaceLibraryAssetId":"polyhaven-rubber-tiles"},"source":{"license":"CC0 1.0","name":"Poly Haven","url":"https://polyhaven.com/a/rubber_tiles"}},{"category":"Paper","description":"Scanned paper fibers with measured color, height, normal, and roughness maps.","id":"ambientcg-paper-006","name":"Natural paper fibers","previewUrl":"https://acg-media.struffelproductions.com/file/ambientCG-Web/media/thumbnail/512-WEBP/Paper006.webp","settings":{"surfaceDepth":24,"surfaceMaterial":"embossed-paper","surfaceMetallic":0,"surfaceRoughness":96,"surfaceScale":42,"surfaceTextureAmount":100,"surfaceLibraryAssetId":"ambientcg-paper-006"},"source":{"license":"CC0 1.0","name":"ambientCG","url":"https://ambientcg.com/a/Paper006"}},{"category":"Gradient","description":"A quiet directional field with smooth tonal separation and deep edge contrast.","id":"signal-axis","name":"Signal axis","settings":{"angle":24,"colorA":"#07090D","colorB":"#394457","colorC":"#F5F7FA","gradient":"linear","grain":3,"relief":0,"style":"grain-gradient"}},{"category":"Gradient","description":"Full-height architectural strips hold crisp edges over a controlled vertical falloff.","id":"spectral-mesh","name":"Signal terraces","settings":{"angle":90,"bandCount":9,"bandDepth":72,"bandGap":2,"colorA":"#06070A","colorB":"#28334A","colorC":"#EEF2FF","focalX":50,"gradient":"mesh","grain":3,"lightingEnabled":true,"relief":0,"style":"grain-gradient"}},{"category":"Gradient","description":"Warm amber, coral, and lilac moving through an orbit field.","id":"solar-orbit","name":"Solar orbit","settings":{"angle":24,"colorA":"#25113D","colorB":"#FF763D","colorC":"#FFD06A","focalX":62,"focalY":46,"gradient":"orbit","grain":8,"relief":12,"style":"grain-gradient"}},{"category":"Gradient","description":"A quiet cyan field with broad directional movement.","id":"mineral-wave","name":"Mineral wave","settings":{"angle":138,"colorA":"#061A22","colorB":"#28B9B1","colorC":"#B9FFF2","gradient":"wave","grain":6,"relief":24,"style":"grain-gradient"}},{"category":"Paper","description":"A focused off-axis aperture with a soft paper falloff and restrained vignette.","id":"paper-light","name":"Paper aperture","settings":{"angle":18,"colorA":"#DDD8CE","colorB":"#F3F0EA","colorC":"#FFFFFF","focalX":34,"focalY":31,"gradient":"radial","grain":2,"relief":8,"style":"grain-gradient"}},{"category":"Print","description":"A monochrome ordered-dither transition for marks and fields.","id":"ink-dither","name":"Ink dither","settings":{"angle":24,"colorA":"#F4F4F0","colorB":"#181818","colorC":"#737373","ditherMatrix":4,"ditherShape":"dots","spacing":16,"style":"dither"}},{"category":"Print","description":"Electric violet and mint resolved into a compact pixel field.","id":"signal-dither","name":"Signal dither","settings":{"angle":145,"colorA":"#130A33","colorB":"#795CFF","colorC":"#7BFFD9","ditherMatrix":8,"ditherShape":"squares","spacing":13,"style":"dither"}},{"category":"Gradient","description":"A soft lilac, mineral blue, and opal field assembled from broad overlapping light blooms.","id":"aurora-veil","name":"Aurora veil","settings":{"angle":18,"colorA":"#15112B","colorB":"#7C70FF","colorC":"#C9FFF1","focalX":32,"focalY":28,"gradient":"bloom","grain":5,"relief":28,"style":"grain-gradient"}},{"category":"Gradient","description":"Deep ultraviolet with a concentrated electric-blue glow and a quiet rose counterpoint.","id":"ultraviolet-dusk","name":"Ultraviolet dusk","settings":{"angle":146,"colorA":"#09051D","colorB":"#5137FF","colorC":"#FF8ED8","focalX":66,"focalY":30,"gradient":"bloom","grain":7,"relief":34,"style":"grain-gradient"}},{"category":"Gradient","description":"Muted rose, warm stone, and clear milk light for editorial and cosmetic surfaces.","id":"rose-quartz","name":"Rose quartz","settings":{"angle":32,"colorA":"#7E4E5B","colorB":"#D8A9A4","colorC":"#FFF4E8","focalX":38,"focalY":34,"gradient":"bloom","grain":4,"relief":22,"style":"grain-gradient"}},{"category":"Gradient","description":"A nocturnal cobalt field with cold cyan light pooling at the edge.","id":"cobalt-haze","name":"Cobalt haze","settings":{"angle":154,"colorA":"#02091D","colorB":"#164ED8","colorC":"#A8F4FF","focalX":72,"focalY":38,"gradient":"orbit","grain":6,"relief":18,"style":"grain-gradient"}},{"category":"Gradient","description":"Oxidized teal moving through warm copper and soft mineral highlights.","id":"copper-patina","name":"Copper patina","settings":{"angle":126,"colorA":"#102F2B","colorB":"#B8603B","colorC":"#E5C48E","focalY":46,"gradient":"wave","grain":10,"relief":28,"style":"grain-gradient"}},{"category":"Paper","description":"Warm cotton stock with restrained fibers and a soft, off-center studio light.","id":"cotton-rag","name":"Cotton rag","settings":{"angle":12,"colorA":"#CFC7B8","colorB":"#ECE6DA","colorC":"#FFFDF8","focalX":42,"focalY":35,"gradient":"radial","grain":14,"pattern":"fibers","patternOpacity":18,"spacing":30,"style":"grain-gradient"}},{"category":"Paper","description":"A cool translucent paper field with fine clouding and scattered pulp flecks.","id":"vellum-mist","name":"Vellum mist","settings":{"angle":20,"colorA":"#C9CED0","colorB":"#E7EAE7","colorC":"#FFFFFF","focalX":31,"focalY":28,"gradient":"bloom","grain":18,"pattern":"speckles","patternOpacity":10,"spacing":26,"style":"grain-gradient"}},{"category":"Paper","description":"Uncoated kraft with visible directional fiber and low-contrast natural variation.","id":"kraft-fiber","name":"Kraft fiber","settings":{"angle":18,"colorA":"#8C6D49","colorB":"#BA9567","colorC":"#D7B98B","gradient":"linear","grain":22,"pattern":"fibers","patternOpacity":24,"spacing":24,"style":"grain-gradient"}},{"category":"Paper","description":"Bleached stock with faint blue-gray shadow and a subtle recycled-paper speckle.","id":"pulp-white","name":"Pulp white","settings":{"angle":142,"colorA":"#D8DDE0","colorB":"#F0F1ED","colorC":"#FFFFFF","gradient":"linear","grain":18,"pattern":"speckles","patternOpacity":12,"spacing":32,"style":"grain-gradient"}},{"category":"Print","description":"A warm risograph bloom with ink overlap, paper grain, and a fine crosshatch screen.","id":"riso-sunset","name":"Riso sunset","settings":{"angle":30,"colorA":"#3C2B66","colorB":"#F05D4D","colorC":"#FFD16B","focalX":38,"focalY":35,"gradient":"bloom","grain":18,"pattern":"crosshatch","patternOpacity":12,"spacing":18,"style":"grain-gradient"}},{"category":"Print","description":"Quiet elevation lines over a mineral gray wash for maps, packaging, and editorial fields.","id":"topographic-mist","name":"Topographic mist","settings":{"angle":18,"colorA":"#D4D8D1","colorB":"#A3ADA2","colorC":"#F6F7F2","focalX":42,"focalY":36,"gradient":"radial","grain":8,"pattern":"topographic","patternOpacity":20,"spacing":38,"style":"grain-gradient"}},{"category":"Print","description":"Dense graphite crosshatching that reads like ink, carbon paper, and technical drafting film.","id":"graphite-hatch","name":"Graphite hatch","settings":{"angle":26,"colorA":"#111216","colorB":"#555B61","colorC":"#DDE1E4","gradient":"linear","grain":12,"pattern":"crosshatch","patternOpacity":34,"spacing":14,"style":"grain-gradient"}},{"category":"Film","description":"A milky pearl film carrying cool blue and pale rose interference without animation.","id":"pearl-film","name":"Pearl film","settings":{"angle":154,"colorA":"#A9C7D5","colorB":"#F3D6DF","colorC":"#FFFDF2","focalX":62,"focalY":38,"gradient":"bloom","grain":4,"relief":18,"style":"grain-gradient"}},{"category":"Film","description":"Static spectral laminate with a dark violet base, cyan shift, and warm foil edge.","id":"spectral-laminate","name":"Spectral laminate","settings":{"angle":128,"colorA":"#21114F","colorB":"#39D9E6","colorC":"#FFB169","focalX":36,"focalY":30,"gradient":"bloom","grain":6,"relief":36,"style":"grain-gradient"}},{"category":"Film","description":"Dark anodized blue with machined vertical terraces and a cool metallic crest.","id":"anodized-cobalt","name":"Anodized cobalt","settings":{"angle":90,"bandCount":14,"bandDepth":88,"bandGap":1,"colorA":"#020714","colorB":"#123D9B","colorC":"#7BCBFF","focalX":62,"gradient":"mesh","grain":7,"lightingEnabled":true,"style":"grain-gradient"}},{"category":"Wood","description":"Warm oak grain crossed by deep CNC-style kerf cuts, with visible directional relief.","id":"kerf-cut-oak","name":"Kerf-cut oak","settings":{"angle":18,"colorA":"#2B160D","colorB":"#8A5630","colorC":"#D8A66A","grain":12,"style":"grain-gradient","surfaceAngle":8,"surfaceDepth":76,"surfaceMaterial":"kerf-wood","surfaceMetallic":0,"surfaceOpenArea":18,"surfaceRoughness":72,"surfaceScale":58}},{"category":"Wood","description":"Pale ash with broad growth lines and shallow routed channels for a quieter architectural panel.","id":"routed-ash","name":"Routed ash","settings":{"angle":6,"colorA":"#8B7358","colorB":"#C7A97E","colorC":"#F0D9B4","gradient":"linear","grain":9,"style":"grain-gradient","surfaceAngle":2,"surfaceDepth":46,"surfaceMaterial":"kerf-wood","surfaceMetallic":0,"surfaceOpenArea":8,"surfaceRoughness":64,"surfaceScale":92}},{"category":"Architecture","description":"Interlaced stainless cable with adjustable open area, raised crossings, and tight specular highlights.","id":"woven-cable-mesh","name":"Woven cable mesh","settings":{"colorA":"#101317","colorB":"#727A83","colorC":"#F1F4F6","gradient":"linear","grain":2,"style":"gradient","surfaceAngle":45,"surfaceDepth":68,"surfaceMaterial":"woven-wire","surfaceMetallic":92,"surfaceOpenArea":64,"surfaceRoughness":24,"surfaceScale":38}},{"category":"Architecture","description":"A dark perforated panel with staggered openings and a low-gloss powder-coated face.","id":"perforated-graphite","name":"Perforated graphite","settings":{"colorA":"#050607","colorB":"#25292D","colorC":"#8A9198","gradient":"radial","grain":3,"style":"gradient","surfaceAngle":0,"surfaceDepth":54,"surfaceMaterial":"perforated-metal","surfaceMetallic":58,"surfaceOpenArea":48,"surfaceRoughness":52,"surfaceScale":42}},{"category":"Architecture","description":"Chiseled mineral planes and hairline fissures with a dry, diffuse stone response.","id":"carved-basalt","name":"Carved basalt","settings":{"colorA":"#111315","colorB":"#3C4144","colorC":"#8A908F","gradient":"bloom","grain":18,"style":"grain-gradient","surfaceAngle":22,"surfaceDepth":72,"surfaceMaterial":"carved-stone","surfaceMetallic":4,"surfaceOpenArea":14,"surfaceRoughness":88,"surfaceScale":86}},{"category":"Paper","description":"Raised geometric impressions pressed into uncoated stock, with soft shadows and no gloss.","id":"blind-emboss-stock","name":"Blind emboss stock","settings":{"colorA":"#D4CEC2","colorB":"#ECE7DE","colorC":"#FFFDF8","gradient":"radial","grain":14,"style":"grain-gradient","surfaceAngle":0,"surfaceDepth":34,"surfaceMaterial":"embossed-paper","surfaceMetallic":0,"surfaceOpenArea":38,"surfaceRoughness":92,"surfaceScale":62}},{"category":"Metal","description":"Fine directional brushing over cool anodized aluminum with a stretched, controlled reflection.","id":"brushed-aluminum","name":"Brushed aluminum","settings":{"angle":90,"colorA":"#252B31","colorB":"#89939D","colorC":"#F3F6F8","gradient":"linear","grain":5,"style":"grain-gradient","surfaceAngle":90,"surfaceDepth":24,"surfaceMaterial":"brushed-metal","surfaceMetallic":96,"surfaceOpenArea":0,"surfaceRoughness":28,"surfaceScale":28}},{"category":"Metal","description":"Irregular shallow dimples break a warm foil reflection into soft, premium highlights.","id":"hammered-brass","name":"Hammered brass","settings":{"colorA":"#3A2109","colorB":"#B4741E","colorC":"#FFE3A0","gradient":"bloom","grain":5,"style":"grain-gradient","surfaceAngle":18,"surfaceDepth":58,"surfaceMaterial":"hammered-foil","surfaceMetallic":94,"surfaceOpenArea":22,"surfaceRoughness":36,"surfaceScale":52}},{"category":"Polymer","description":"Tight molded ribs with deep directional shadow, suited to technical housings and grip surfaces.","id":"ribbed-polymer","name":"Ribbed polymer","settings":{"colorA":"#05070A","colorB":"#1E2630","colorC":"#647384","gradient":"linear","grain":3,"style":"gradient","surfaceAngle":90,"surfaceDepth":82,"surfaceMaterial":"corrugated-polymer","surfaceMetallic":8,"surfaceOpenArea":26,"surfaceRoughness":68,"surfaceScale":34}},{"category":"Natural","description":"Compressed cork cells, dark inclusions, and fibrous grain form a warm acoustic composite.","id":"cork-acoustic","name":"Cork acoustic","settings":{"colorA":"#3A2414","colorB":"#8B5D32","colorC":"#D0A66D","gradient":"radial","grain":24,"style":"grain-gradient","surfaceAngle":12,"surfaceDepth":42,"surfaceMaterial":"cork-composite","surfaceMetallic":0,"surfaceOpenArea":34,"surfaceRoughness":96,"surfaceScale":46}},{"category":"Glass","description":"A translucent etched field with dense micro-pitting and a broad pearlescent light response.","id":"frosted-pearl-glass","name":"Frosted pearl glass","settings":{"colorA":"#71808B","colorB":"#C6D4D8","colorC":"#FFF8EE","gradient":"bloom","grain":16,"style":"grain-gradient","surfaceAngle":30,"surfaceDepth":18,"surfaceMaterial":"frosted-glass","surfaceMetallic":18,"surfaceOpenArea":72,"surfaceRoughness":78,"surfaceScale":32}},{"category":"Textile","description":"Interactive iridescent foil cloth with suspended wrinkles, woven microstructure, diffraction bands, and metallic sparkle.","id":"holographic-drape","name":"Holographic drape","settings":{"colorA":"#FF6CC4","colorB":"#7AF7E1","colorC":"#8D8BFF","gradient":"bloom","grain":10,"style":"grain-gradient","surfaceAngle":34,"surfaceDepth":68,"surfaceIrregularity":74,"surfaceMaterial":"holo-cloth","surfaceMetallic":94,"surfaceOpenArea":68,"surfaceRoughness":14,"surfaceScale":72,"surfaceTextureAmount":96}},{"category":"Textile","description":"Alternating warp and weft threads with subtle slub variation and a dry woven highlight.","id":"natural-linen-weave","name":"Natural linen","settings":{"colorA":"#726657","colorB":"#B8AA94","colorC":"#EEE5D5","gradient":"linear","grain":12,"style":"grain-gradient","surfaceAngle":2,"surfaceDepth":42,"surfaceIrregularity":46,"surfaceMaterial":"linen-weave","surfaceMetallic":0,"surfaceOpenArea":18,"surfaceRoughness":92,"surfaceScale":30,"surfaceTextureAmount":82}},{"category":"Textile","description":"Dense matted fibers form a quiet wool field with soft directional nap and almost no specular edge.","id":"graphite-felt","name":"Graphite felt","settings":{"colorA":"#111214","colorB":"#303235","colorC":"#74777A","gradient":"radial","grain":28,"style":"grain-gradient","surfaceAngle":18,"surfaceDepth":24,"surfaceIrregularity":86,"surfaceMaterial":"felted-wool","surfaceMetallic":0,"surfaceOpenArea":30,"surfaceRoughness":100,"surfaceScale":22,"surfaceTextureAmount":76}},{"category":"Leather","description":"Irregular raised pebble grain over a deep dyed hide, balancing soft valleys and polished high points.","id":"oxblood-pebbled-leather","name":"Oxblood leather","settings":{"colorA":"#160808","colorB":"#5A1E22","colorC":"#B56357","gradient":"bloom","grain":10,"style":"grain-gradient","surfaceAngle":12,"surfaceDepth":48,"surfaceIrregularity":74,"surfaceMaterial":"pebbled-leather","surfaceMetallic":0,"surfaceOpenArea":22,"surfaceRoughness":62,"surfaceScale":38,"surfaceTextureAmount":88}},{"category":"Ceramic","description":"Fine crackle lines sit beneath a glossy celadon glaze, with gentle pooling around the network.","id":"celadon-crackle","name":"Celadon crackle","settings":{"colorA":"#293E38","colorB":"#8AA89C","colorC":"#E5EEE6","gradient":"radial","grain":4,"style":"grain-gradient","surfaceAngle":0,"surfaceDepth":18,"surfaceIrregularity":68,"surfaceMaterial":"crackle-glaze","surfaceMetallic":4,"surfaceOpenArea":16,"surfaceRoughness":18,"surfaceScale":62,"surfaceTextureAmount":72}},{"category":"Mineral","description":"Fine aggregate and shallow pits create a chalky architectural plaster with diffuse mineral light.","id":"sandblasted-lime-plaster","name":"Lime plaster","settings":{"colorA":"#8F887B","colorB":"#C5BFB2","colorC":"#F3EFE5","gradient":"linear","grain":22,"style":"grain-gradient","surfaceAngle":28,"surfaceDepth":34,"surfaceIrregularity":92,"surfaceMaterial":"sandblasted-plaster","surfaceMetallic":0,"surfaceOpenArea":48,"surfaceRoughness":96,"surfaceScale":26,"surfaceTextureAmount":84}},{"category":"Composite","description":"A tight 2×2 carbon twill alternates raised bundles under a controlled resin sheen.","id":"carbon-twill-satin","name":"Carbon twill","settings":{"colorA":"#030405","colorB":"#171B20","colorC":"#68717A","gradient":"linear","grain":3,"style":"gradient","surfaceAngle":45,"surfaceDepth":38,"surfaceIrregularity":12,"surfaceMaterial":"carbon-twill","surfaceMetallic":48,"surfaceOpenArea":10,"surfaceRoughness":26,"surfaceScale":30,"surfaceTextureAmount":92}},{"category":"Static shaders","description":"A deterministic, non-moving translation of the soft Sea mesh vocabulary from the shader library.","id":"static-mesh-sea","name":"Static mesh · Sea","settings":{"colorA":"#06131D","colorB":"#1B7181","colorC":"#9EF0DB","focalX":38,"focalY":34,"gradient":"bloom","grain":3,"relief":20,"style":"grain-gradient"}},{"category":"Static shaders","description":"The original static mesh family rebuilt as a portable three-color SVG field.","id":"static-mesh-default","name":"Static mesh · Default","settings":{"colorA":"#17151F","colorB":"#6C5CE7","colorC":"#E8E2FF","focalX":44,"focalY":38,"gradient":"bloom","grain":3,"relief":22,"style":"grain-gradient"}},{"category":"Static shaders","description":"Warm period color and broad mesh falloff translated into a still SVG recipe.","id":"static-mesh-1960s","name":"Static mesh · 1960s","settings":{"angle":28,"colorA":"#4A1814","colorB":"#E86A33","colorC":"#F4D27A","focalX":35,"focalY":42,"gradient":"orbit","grain":8,"relief":16,"style":"grain-gradient"}},{"category":"Static shaders","description":"Coral, violet, and gold hold a sunset mesh without a render loop.","id":"static-mesh-sunset","name":"Static mesh · Sunset","settings":{"angle":142,"colorA":"#251239","colorB":"#F45D63","colorC":"#FFCF70","focalX":62,"focalY":32,"gradient":"bloom","grain":6,"relief":30,"style":"grain-gradient"}},{"category":"Static shaders","description":"A portable cross-section radial field with no playback or GPU dependency.","id":"static-radial-cross-section","name":"Static radial · Cross section","settings":{"angle":72,"colorA":"#09090B","colorB":"#8874FF","colorC":"#F8EFDD","focalX":28,"focalY":48,"gradient":"radial","grain":2,"style":"grain-gradient"}},{"category":"Static shaders","description":"The base radial shader composition recast as a focused, editable SVG aperture.","id":"static-radial-default","name":"Static radial · Default","settings":{"angle":28,"colorA":"#0D1017","colorB":"#5D6BFF","colorC":"#F7FAFF","focalX":42,"focalY":38,"gradient":"radial","grain":2,"style":"grain-gradient"}},{"category":"Static shaders","description":"Low-resolution color steps, restrained noise, and a deliberately graphic radial falloff.","id":"static-radial-lofi","name":"Static radial · Lo-Fi","settings":{"angle":15,"colorA":"#19121F","colorB":"#CE5A67","colorC":"#F1D7A0","ditherMatrix":8,"ditherShape":"squares","focalX":34,"focalY":42,"gradient":"radial","grain":14,"spacing":18,"style":"grain-gradient"}},{"category":"Static shaders","description":"A centered halo with clean concentric light and portable vector construction.","id":"static-radial-radial","name":"Static radial · Radial","settings":{"colorA":"#030A13","colorB":"#1686A2","colorC":"#E6FFF8","focalX":50,"focalY":50,"gradient":"radial","grain":4,"style":"grain-gradient"}},{"category":"Static shaders","description":"Cardboard fibers and particulate grain rebuilt as a deterministic SVG paper recipe.","id":"static-paper-cardboard","name":"Paper texture · Cardboard","settings":{"angle":12,"colorA":"#5C3F26","colorB":"#9A7047","colorC":"#D1AD7A","gradient":"linear","grain":26,"pattern":"fibers","patternOpacity":30,"spacing":22,"style":"grain-gradient","surfaceDepth":18,"surfaceMaterial":"embossed-paper","surfaceRoughness":94,"surfaceScale":34}}],"schemaVersion":1,"stickerControls":{"bevelWidth":{"default":8,"maximum":32,"minimum":2,"step":1,"type":"number"},"borderColor":{"default":"#F7F7F2","type":"hex-color"},"depth":{"default":46,"maximum":100,"minimum":0,"step":1,"type":"number"},"edgeWidth":{"default":15,"maximum":32,"minimum":2,"step":1,"type":"number"},"glintAngle":{"default":28,"maximum":180,"minimum":0,"step":1,"type":"number"},"insetDepth":{"default":24,"maximum":100,"minimum":0,"step":1,"type":"number"},"intensity":{"default":76,"maximum":100,"minimum":0,"step":1,"type":"number"},"seamWidth":{"default":2,"maximum":12,"minimum":0,"step":1,"type":"number"},"texture":{"default":22,"maximum":100,"minimum":0,"step":1,"type":"number"}},"stickerFinishCount":13,"stickerFinishes":[{"description":"Rainbow spectral laminate, clear die-cut rim, and a sharp traveling highlight.","id":"holo-vinyl","label":"Holo vinyl","settings":{"bands":9,"curl":9,"cutTolerance":3,"hueShift":0,"ink":100,"overlay":"none","pattern":"linear","peelAmount":24,"peelDirection":"top-right","relief":22,"shadow":42,"bevelWidth":8,"borderColor":"#F7F7F2","insetDepth":24,"seamWidth":2,"depth":46,"edgeWidth":15,"glintAngle":28,"intensity":76,"presetId":"holo-vinyl","texture":22},"source":{"license":"MIT","name":"HoloSticker","url":"https://github.com/jal-co/holosticker"},"swatch":"linear-gradient(130deg,#ffb7d5 0%,#fff3a4 22%,#9fffd9 44%,#89c8ff 66%,#d9a7ff 84%,#fff 100%)"},{"description":"Geometric rainbow facets modeled after prismatic reflective film.","id":"prismatic","label":"Prismatic","settings":{"bands":9,"curl":9,"cutTolerance":3,"hueShift":0,"ink":100,"overlay":"none","pattern":"linear","peelAmount":24,"peelDirection":"top-right","relief":22,"shadow":42,"bevelWidth":8,"borderColor":"#F7F7F2","insetDepth":24,"seamWidth":2,"depth":38,"edgeWidth":14,"glintAngle":52,"intensity":82,"presetId":"prismatic","texture":34},"source":{"license":"MIT","name":"HoloSticker","url":"https://github.com/jal-co/holosticker"},"swatch":"conic-gradient(from 35deg,#ff6b9d,#ffe66d,#70ffcc,#59a9ff,#bd75ff,#ff6b9d)"},{"description":"High-contrast silver mirror with a crisp studio-light band.","id":"mirror-chrome","label":"Mirror chrome","settings":{"bands":9,"curl":9,"cutTolerance":3,"hueShift":0,"ink":100,"overlay":"none","pattern":"linear","peelAmount":24,"peelDirection":"top-right","relief":22,"shadow":42,"bevelWidth":8,"borderColor":"#F7F7F2","insetDepth":24,"seamWidth":2,"depth":54,"edgeWidth":13,"glintAngle":112,"intensity":88,"presetId":"mirror-chrome","texture":4},"swatch":"linear-gradient(150deg,#25272b 0%,#f9fafb 22%,#777d86 41%,#fff 54%,#34373c 78%,#dfe3e8)"},{"description":"Directional metallic grain with a satin aluminum reflection.","id":"brushed-metal","label":"Brushed metal","settings":{"bands":9,"curl":9,"cutTolerance":3,"hueShift":0,"ink":100,"overlay":"none","pattern":"linear","peelAmount":24,"peelDirection":"top-right","relief":22,"shadow":42,"bevelWidth":8,"borderColor":"#F7F7F2","insetDepth":24,"seamWidth":2,"depth":44,"edgeWidth":13,"glintAngle":8,"intensity":64,"presetId":"brushed-metal","texture":58},"swatch":"repeating-linear-gradient(92deg,#777 0 1px,#d9d9d9 1px 3px,#999 3px 4px)"},{"description":"Milky opal interference with a soft blue-to-rose color shift.","id":"pearl-laminate","label":"Pearl laminate","settings":{"bands":9,"curl":9,"cutTolerance":3,"hueShift":0,"ink":100,"overlay":"none","pattern":"linear","peelAmount":24,"peelDirection":"top-right","relief":22,"shadow":42,"bevelWidth":8,"borderColor":"#F7F7F2","insetDepth":24,"seamWidth":2,"depth":34,"edgeWidth":16,"glintAngle":36,"intensity":58,"presetId":"pearl-laminate","texture":14},"swatch":"radial-gradient(circle at 28% 26%,#fff 0%,#bde8ff 30%,#f7c8dd 62%,#fff5cf 100%)"},{"description":"Fine reflective particles suspended in a clear glossy laminate.","id":"glitter-flake","label":"Glitter flake","settings":{"bands":9,"curl":9,"cutTolerance":3,"hueShift":0,"ink":100,"overlay":"none","pattern":"linear","peelAmount":24,"peelDirection":"top-right","relief":22,"shadow":42,"bevelWidth":8,"borderColor":"#F7F7F2","insetDepth":24,"seamWidth":2,"depth":42,"edgeWidth":15,"glintAngle":64,"intensity":78,"presetId":"glitter-flake","texture":88},"source":{"license":"MIT","name":"HoloSticker","url":"https://github.com/jal-co/holosticker"},"swatch":"radial-gradient(circle at 25% 32%,#fff 0 3%,transparent 4%),radial-gradient(circle at 70% 62%,#fff 0 2%,transparent 3%),linear-gradient(135deg,#724cff,#ff81bd,#55e6d2)"},{"description":"Microprismatic high-visibility film with a concentrated flash response.","id":"retroreflective","label":"Retroreflective","settings":{"bands":9,"curl":9,"cutTolerance":3,"hueShift":0,"ink":100,"overlay":"none","pattern":"linear","peelAmount":24,"peelDirection":"top-right","relief":22,"shadow":42,"bevelWidth":8,"borderColor":"#F7F7F2","insetDepth":24,"seamWidth":2,"depth":30,"edgeWidth":12,"glintAngle":92,"intensity":92,"presetId":"retroreflective","texture":72},"swatch":"radial-gradient(circle,#fff 0 9%,#aeb7c3 10% 24%,transparent 25%) 0 0/12px 12px,#697381"},{"description":"Translucent frosted vinyl with softened color and a pale clear edge.","id":"clear-frost","label":"Clear frost","settings":{"bands":9,"curl":9,"cutTolerance":3,"hueShift":0,"ink":100,"overlay":"none","pattern":"linear","peelAmount":24,"peelDirection":"top-right","relief":22,"shadow":42,"bevelWidth":8,"borderColor":"#F7F7F2","insetDepth":24,"seamWidth":2,"depth":26,"edgeWidth":18,"glintAngle":22,"intensity":34,"presetId":"clear-frost","texture":52},"swatch":"linear-gradient(135deg,rgba(255,255,255,.9),rgba(182,211,220,.58)),radial-gradient(circle,#fff 0 1px,transparent 1px)"},{"description":"Diffuse low-glare laminate with a dry, velvety surface response.","id":"soft-touch","label":"Soft touch","settings":{"bands":9,"curl":9,"cutTolerance":3,"hueShift":0,"ink":100,"overlay":"none","pattern":"linear","peelAmount":24,"peelDirection":"top-right","relief":22,"shadow":42,"bevelWidth":8,"borderColor":"#F7F7F2","insetDepth":24,"seamWidth":2,"depth":24,"edgeWidth":14,"glintAngle":40,"intensity":18,"presetId":"soft-touch","texture":38},"swatch":"linear-gradient(145deg,#27292d,#8d9299 48%,#34363a)"},{"description":"Selective high-gloss varnish that leaves the printed surface visible underneath.","id":"spot-gloss","label":"Spot gloss","settings":{"bands":9,"curl":9,"cutTolerance":3,"hueShift":0,"ink":100,"overlay":"none","pattern":"linear","peelAmount":24,"peelDirection":"top-right","relief":22,"shadow":42,"bevelWidth":8,"borderColor":"#F7F7F2","insetDepth":24,"seamWidth":2,"depth":28,"edgeWidth":13,"glintAngle":120,"intensity":68,"presetId":"spot-gloss","texture":3},"swatch":"linear-gradient(115deg,#30343a 0 38%,#fff 45%,#474c55 53% 100%)"},{"description":"A thick clear resin dome with rounded edge light and amplified depth.","id":"epoxy-dome","label":"Epoxy dome","settings":{"bands":9,"curl":9,"cutTolerance":3,"hueShift":0,"ink":100,"overlay":"none","pattern":"linear","peelAmount":24,"peelDirection":"top-right","relief":22,"shadow":42,"bevelWidth":8,"borderColor":"#F7F7F2","insetDepth":24,"seamWidth":2,"depth":82,"edgeWidth":19,"glintAngle":24,"intensity":86,"presetId":"epoxy-dome","texture":2},"swatch":"radial-gradient(circle at 28% 20%,#fff 0 7%,transparent 18%),linear-gradient(145deg,#98b9d4,#263f5c)"},{"description":"Pressed metallic foil with a restrained raised edge and tactile paper tooth.","id":"embossed-foil","label":"Embossed foil","settings":{"bands":9,"curl":9,"cutTolerance":3,"hueShift":0,"ink":100,"overlay":"none","pattern":"linear","peelAmount":24,"peelDirection":"top-right","relief":22,"shadow":42,"bevelWidth":8,"borderColor":"#F7F7F2","insetDepth":24,"seamWidth":2,"depth":68,"edgeWidth":12,"glintAngle":136,"intensity":72,"presetId":"embossed-foil","texture":48},"swatch":"linear-gradient(140deg,#5e441e,#f6dc91 30%,#9d772e 50%,#fff0b1 68%,#60451f)"},{"description":"A polished structural metal perimeter, microscopic seam, and recessed satin insert inspired by precision-manufactured emblems.","id":"precision-metal-inset","label":"Precision metal inset","settings":{"bands":9,"curl":9,"cutTolerance":3,"hueShift":0,"ink":100,"overlay":"none","pattern":"linear","peelAmount":24,"peelDirection":"top-right","relief":22,"shadow":42,"bevelWidth":18,"borderColor":"#F4F2EC","insetDepth":72,"seamWidth":3,"depth":78,"edgeWidth":10,"glintAngle":18,"intensity":88,"presetId":"precision-metal-inset","texture":46},"swatch":"linear-gradient(145deg,#111317 0 7%,#f8fafb 15%,#696e75 25%,#e9ecef 34%,#22262b 42% 70%,#aeb3b9 78%,#fff 88%,#4e535a 100%)"}],"staticShaderIds":["paper-static-mesh-gradient","paper-static-mesh-gradient-1960s","paper-static-mesh-gradient-sunset","paper-static-mesh-gradient-sea","paper-static-radial-gradient","paper-static-radial-gradient-lo-fi","paper-static-radial-gradient-cross-section","paper-static-radial-gradient-radial"]},"tools":[{"category":"Brand","description":"Edit the shared identity, asset library, font files, colors, voice, strategy, and system defaults used everywhere.","id":"identity","keywords":["brand settings","identity","assets","asset library","fonts","font upload","colors","typography","logos","strategy","voice","foundations"],"name":"Brand identity","shortcut":"I"},{"category":"Brand","description":"Apply the active identity across digital, developer, social, editorial, event, and physical touchpoints.","id":"brand-elements","keywords":["email","cli","ascii","twitter","x post","slides","deck","lanyard","business card","web card","logo background","event badge","sticker","letterhead","press kit"],"name":"Brand elements","shortcut":"E"},{"category":"Brand","description":"Compose the identity as an application showcase or complete system board, then export a high-resolution PNG.","id":"design-board","keywords":["brand board","design board","moodboard","style tile","identity","guidelines"],"name":"Moodboard","shortcut":"D"},{"category":"Brand","description":"Read, review, and export a complete editorial brand book generated from the active identity system.","id":"brand-book","keywords":["brand book","brand guide","guidelines","standards","manual","identity book","pdf","foundations","logo","typography","color","illustration","iconography","composition","showcase"],"name":"Brand book","shortcut":"K"},{"category":"Motion","description":"Animate text and images with deterministic packages and cubic Bézier timing.","id":"animation","keywords":["gif","morph","typing","crossfade","frames","cubic bezier"],"name":"Animation","shortcut":"A"},{"category":"Motion","description":"Import, recolor, trim, preview, and export Lottie JSON or .lottie vector animation.","id":"lottie","keywords":["lottie","dotlottie","vector animation","json animation","playback","trim","recolor"],"name":"Lottie","shortcut":"L"},{"category":"Foundations","description":"Explore with loose layers on an open canvas, then frame type, images, stickers, effects, and shaders into export-ready artboards.","id":"material","keywords":["design lab","infinite canvas","loose layers","frame selection","composition","playground","typography","rich text","selected text formatting","svg conversion","layer editor","sticker","die cut","outline","surface lab","dither","grain","texture","material","shader","webgl","shadergradient","liquid glass","liquid metal","aurora","plasma","animated","finish","reflection","shadow","gif"],"name":"Design Lab","shortcut":"M"},{"category":"Expressions","description":"Compose repeatable social previews with fonts, logos, and background assets.","id":"opengraph","keywords":["open graph","og image","social preview","font upload","logo upload"],"name":"OpenGraph","shortcut":"O"},{"category":"Foundations","description":"Inspect semantic colors in HEX and OKLCH across light and dark surfaces.","id":"colors","keywords":["palette","hex","oklch","tokens","primary","secondary","accent"],"name":"Color tokens","shortcut":"C"},{"category":"Foundations","description":"Compare primary, secondary, accent, and code faces or load a local font file.","id":"typography","keywords":["font selector","font upload","type scale","primary","secondary","accent","code"],"name":"Typography","shortcut":"T"},{"category":"Expressions","description":"Render Prism-tokenized TypeScript, Python, and Bash cards with matching PNG output.","id":"terminal","keywords":["code","syntax","cli","typescript","python","bash","language colors"],"name":"Terminal card","shortcut":"⌘"},{"category":"Expressions","description":"Build an optically balanced active-brand and partner logo lockup.","id":"partnership","keywords":["partner","partnership lockup","co-brand","sponsor","logo upload"],"name":"Partnership lockup","shortcut":"P"},{"category":"Expressions","description":"Create reusable editorial covers with controlled type and texture.","id":"blog","keywords":["blog cover","article","editorial","texture","background image"],"name":"Blog cover","shortcut":"B"},{"category":"Expressions","description":"Build a complete 16:9 presentation system from multiple reusable slide layouts.","id":"slides","keywords":["slide templates","deck","presentation","keynote","powerpoint","title","agenda","quote","metrics","timeline"],"name":"Slide templates","shortcut":"S"},{"category":"Components","description":"Review core interface controls, navigation, forms, feedback, data, and commerce patterns.","id":"buttons","keywords":["component library","buttons","inputs","forms","navigation","modal","toast","table","pricing","cards"],"name":"Component library","shortcut":"V"}],"version":"0.3.0"}