Introduction
Getting StartedAccount & RegistrationDashboardTeam Collaboration
Editor BasicsDesign ModeAnimation & TimelineVideo ElementsMusic & Audio
How to Animate an SVG in the Browser (No Code)How to Make a Logo Reveal AnimationHow to Turn Product Screenshots into a Demo AnimationHow to Export a Transparent PNG (and What to Do When You Need Transparent Video)How to Make an Animated Gradient Background for VideoHow to Import and Animate a 3D Model (GLB/GLTF)Free Local Tools: Clean Up, Background Remover and Film Emulator
KinoViz AI Assistant3D SystemMaterials & Visual EffectsPhysics & EffectsComponents
KinoVizKinoViz
Advanced

Materials & Visual Effects

A guide to KinoViz materials and visual effects — Liquid Glass, Reeded Glass and Frosted Glass, Liquid Metal for 3D, Glow and Bloom, image and video filters with tone presets, ASCII art, Gooey Group and Cell Group, and blend modes.

Overview

Beyond position and color, KinoViz lets you apply rich materials and visual effects to your elements — realistic glass surfaces, flowing metal, glowing halos, photographic filters, and more. Nearly every value is a keyframable property, so effects can animate over time just like any other part of your design.

Most material and effect controls live in the Effects and Filters panels on the right sidebar. Select an element to reveal the panels that apply to it.

The Effects panel showing the Material dropdown with Liquid Glass parameters, and the Modifiers section with Glow and Layer Blur.

For current plan availability, see the pricing page and Billing & Plans. Layer blur, background blur, and physics-driven effects are covered separately in Physics & Effects.

Glass Materials

KinoViz ships three distinct glass materials, all found in the Effects panel under the Material dropdown. They are mutually exclusive — an element uses one glass material at a time — but you can still stack modifiers like Glow, Shadow, and Layer Blur on top.

Every glass parameter is a keyframable property. Animate them over the timeline to make light sweep across a surface, ridges tighten, or frost bloom in.

Glass materials are available on the Pro plan and above. On lower plans the dropdown options are labeled [Pro] and prompt an upgrade.

Liquid Glass

An iOS-style refractive glass surface. The element bends and disperses the content behind it, adds a bright rim, and sweeps a directional highlight along its border.

Controls, grouped in the panel:

GroupSliderWhat it does
GlassRefractStrength of the edge distortion that bends the background
GlassDispersionRGB channel splitting at the edges for a rainbow fringe
GlassDepthHow far the refraction band reaches inward
GlassRim glowBrightness of the ring of light around the edge
LightingHighlightIntensity of the directional light band
LightingLight angleDirection of the light source (0–360°)
LightingLight widthHow far the highlight band extends inward from the border
LightingLight glowBrightness multiplier for the highlight
BackgroundBG blurAmount the background is blurred through the glass
Tintcolor + OpacityGlass tint color and how strongly it dyes the surface

Keyframe Light angle from 0 to 360 for a highlight that sweeps all the way around the element — a signature "premium glass" reveal.

Use Reset to Default to restore the standard Liquid Glass look.

Reeded Glass

Fluted vertical ridges that bend light like a row of cylindrical lenses — the classic "reeded" or fluted architectural glass look.

SliderWhat it does
Ridge densityNumber of vertical ridges across the surface
DirectionRidge orientation (0–180°; 0 is vertical, the classic look)
Edge sharpnessHow crisp vs. soft the ridge boundaries are
RefractionStrength of the light bending through each ridge
DispersionRainbow color splitting along the ridges
SoftnessBlur applied between the ridges
Tint color + Tint opacityGlass tint and its strength

Keyframe Ridge density to make the flutes appear to tighten or spread as the animation plays.

Frosted Glass

A uniform backdrop blur with subtle grain — soft, translucent, and diffuse, like sandblasted glass.

SliderWhat it does
FrostinessMain blur strength of the frosted surface
GrainAmount of surface grain noise
Grain scaleSize / spatial frequency of the grain
Edge rimSubtle bright edge highlight
Tint color + Tint opacityGlass tint and its strength

Keyframe Frostiness from 0 upward to bloom frost onto an element as it settles into place.

Liquid Metal (3D)

Liquid Metal is a flowing, iridescent metal material for 3D model elements. It lives in the 3D model panel under the Material Effect section — choose Liquid Metal from the dropdown. The surface shimmers with an oil-slick, thin-film sheen and can flow continuously over the model.

GroupSliderWhat it does
Fluid DynamicsSpeedHow fast the metal flows
Fluid DynamicsScaleSize of the flow pattern
Fluid DynamicsDistortStrength of the surface distortion
Fluid DynamicsShapeHow much the model's form shapes the flow
Fluid DynamicsEdgeEdge protection to keep silhouettes clean
IridescenceIntensityStrength of the rainbow thin-film sheen
IridescenceIORIndex of refraction (physical, 1–3)
IridescenceThick Min / Thick MaxThin-film thickness range that sets the color spread

Liquid Metal is available on the Pro plan and above. See 3D System for importing and animating 3D models.

Glow & Bloom

Glow wraps any element in a soft halo of light. It lives in the Effects panel under Modifiers — toggle Glow on to reveal its controls.

ControlWhat it does
IntensityHalo strength, 0–200%. Past 100% the glow enters a hot bloom — light spills over the edges and overexposes, the way a bright light blooms on camera.
SizeHow far the halo spreads
ColorLeave it on the default self-color to glow with the element's own colors, or pick a color for a tinted halo

Because Intensity is keyframable, you can animate a gentle breathing pulse or a bright flash at a beat.

Glow and Bloom are available on the Pro plan and above.

Image & Video Filters

Select an image or video element to reveal the Filters panel. Filters are non-destructive, keyframable, and apply to both images and video.

Basic adjustments — available on all plans:

Bright, Contrast, Saturate, Hue, Blur, Gray, and Noise.

Effect filters — Pro plan and above (shown under the EFFECTS subheading, labeled [Pro] on lower plans):

Pixel, Vibrance, Sharpen, and Invert.

Tone presets — Pro plan and above (choose one from the Preset dropdown):

Sepia, Vintage, Kodachrome, Polaroid, Brownie, Technicolor, and B&W.

Use Reset Filters to clear every slider and preset back to neutral.

ASCII Art

ASCII Art turns an element into a grid of text characters that trace its brightness — a retro terminal / dot-matrix look. It sits alongside the glass materials in the Effects → Material dropdown (and is therefore mutually exclusive with them). Controls include character Size, a Mode (Color, Mono, or Green), Invert, Gamma, background opacity, and font scale.

ASCII Art is available on the Pro plan and above.

Gooey Group

Gooey Group fuses two or more shapes into a single liquid blob, with edges that melt together where the shapes overlap or sit close together.

Select two or more shapes or paths, right-click the selection, and choose Gooey Group from the context menu. The Effects panel then shows a Gooey module for the group.

ControlWhat it does
StrengthHow far the liquid membrane grows between shapes, 4–80 (default 24)
Fill Color toggle + ColorOff (default) blends each shape's own color into the merge. On lets you pick one solid Color for the whole blob
Fill OpacityOpacity of the merged blob

All three controls are keyframable — animate Strength so the blob squeezes tighter or relaxes as the shapes move, or keyframe Fill Opacity for a fade-in reveal.

Great for liquid logo reveals, blob-morph backgrounds, or turning a handful of dots into an amoeba-like loading animation. Gooey Group can't be turned into a Custom Component yet.

Gooey Group and Cell Group are available on the Pro plan and above.

Cell Group

Cell Group is the inverse effect: shapes don't merge — they press against each other into rounded, evenly-gapped "cells," like a bubble raft or cobblestone paving, while each shape keeps its own color.

Select 2–16 shapes or paths, right-click the selection, and choose Cell Group from the context menu. The Effects panel then shows a Cell Group module. Wireframe or outline shapes are mapped into filled cell outlines.

ControlWhat it does
Cell GapSpacing between cells, 0–40 (default 8)
SoftnessHow much cells deform under pressure — 0 keeps them rigid circles that only push apart, 100 allows full soft-body squeezing (default 70)
SmoothingCorner rounding on the cell boundaries, 0–100 (default 15)

All three controls are keyframable, so a cell pack can relax, tighten, or ripple over time like a physics-driven simulation.

Great for bubble or membrane textures, mosaic and pebble-paving layouts, or breaking one shape into organic puzzle pieces. Cell Group can't be turned into a Custom Component yet.

Gooey Group and Cell Group are available on the Pro plan and above.

Blend Modes

Every element has a Blend dropdown in the Opacity panel. Blend modes control how an element's colors mix with the layers beneath it — Multiply, Screen, Overlay, and more — the same modes you'd find in a design tool. Blend modes are available on all plans and are a quick way to build glows, tints, and compositing tricks without any extra material.

Layer Blur & Background Blur

Two more effects — Layer Blur (blur the element itself) and Background Blur (blur everything behind a translucent element) — are documented alongside physics and TextFX in Physics & Effects.

Next Steps

  • Physics & Effects — Layer blur, background blur, TextFX, and physics
  • 3D System — Import 3D models and apply Liquid Metal
  • Animation & Timeline — Keyframe any material or effect parameter over time
  • Billing & Plans — See which effects each plan unlocks

3D System

How KinoViz's browser-based 3D system works — importing GLB/GLTF models, camera and materials, lighting and HDRI, SVG-to-3D extrusion, and 3D animation.

Physics & Effects

A guide to KinoViz's physics engine and effects — rigid body simulation, joints and constraints, TextFX animation presets, layer blur, and backdrop blur.

On this page

Overview
Glass Materials
Liquid Glass
Reeded Glass
Frosted Glass
Liquid Metal (3D)
Glow & Bloom
Image & Video Filters
ASCII Art
Gooey Group
Cell Group
Blend Modes
Layer Blur & Background Blur
Next Steps