HTML / CSS / JavaScript

Creative Visual Effects

Particles, light and shadow, gradients, space, and interactive visuals.

57category cases
Currently showing 57 cases
0017Creative Visual Effects

Romantic Snowfall Effect

A full-screen Canvas snowfall scene with adjustable snowfall and wind direction.

HTMLCanvasJavaScriptSnow
Open and run
0018Creative Visual Effects

Canvas Fireworks Effect

An interactive particle effect that bursts into colorful fireworks when you click the night sky.

HTMLCanvasJavaScriptFireworks
Open and run
0019Creative Visual Effects

Analog Clock

A delicate mechanical watch face that turns in real time according to local time.

HTMLCSSJavaScriptClock
Open and run
0020Creative Visual Effects

Particle Trail Effect

Colorful glowing particles that flow along mouse or touch trails.

HTMLCanvasJavaScriptParticles
Open and run
0033Creative Visual Effects

Deep-Sea Interactive Particle Field

Complete an interactive particle field in a deep-sea scene: includes real content, actionable controls, clear status feedback, and responsive layouts.

Creative Visual EffectsInteractive Particle FieldHTMLCanvasJavaScript
Open and run
0049Creative Visual Effects

Deep-Sea Organic Fluid Shapes

Complete organic fluid shapes in a deep-sea setting: includes real content, interactive controls, clear status feedback, and responsive layouts across sizes.

Creative Visual EffectsOrganic Fluid ShapesHTMLCSS AnimationJavaScript
Open and run
0065Creative Visual Effects

Deep-sea gradient mesh experiment

Complete a gradient mesh experiment in a deep-sea scene: includes real content, interactive controls, clear state feedback, and responsive layouts.

Creative Visual EffectsGradient Mesh ExperimentHTMLCanvasJavaScript
Open and run
0081Creative Visual Effects

Deep Sea Spotlight Stage

Complete a spotlight stage in a deep-sea scenario: includes realistic content, interactive controls, clear state feedback, and responsive layouts across sizes.

Creative Visual EffectsSpotlight StageHTMLCanvasJavaScript
Open and run
0097Creative Visual Effects

Deep-sea multilayer wave scene

Complete a multi-layer wave scene in a deep-sea setting: includes real content, interactive controls, clear status feedback, and cross-size layouts.

Creative Visual EffectsMulti-layer Wave SceneHTMLCSS AnimationJavaScript
Open and run
0113Creative Visual Effects

Deep-sea starfield traversal effect

A starfield travel effect completed in a deep-sea setting: includes realistic content, interactive controls, clear status feedback, and responsive layouts across sizes.

Creative Visual EffectsStarfield traversal effectHTMLCanvasJavaScript
Open and run
0129Creative Visual Effects

Deep Sea Confetti Burst Effect

Complete confetti burst effects in deep-sea scenarios: includes real content, actionable controls, clear state feedback, and cross-size layouts.

Creative Visual EffectsConfetti Burst EffectHTMLCanvasJavaScript
Open and run
0145Creative Visual Effects

Deep-Sea Kaleidoscope Pattern

Complete a kaleidoscope pattern in an underwater scenario: includes real content, actionable controls, clear status feedback, and cross-size layout.

Creative Visual EffectsKaleidoscope PatternHTMLCanvasJavaScript
Open and run
0161Creative Visual Effects

Deep Sea Glass Depth Space

Complete the glass depth spatial scene in the deep-sea scenario: includes realistic content, actionable controls, clear status feedback, and responsive layouts across sizes.

Creative Visual EffectsGlass Depth SpaceHTMLCSS GridResponsive Design
Open and run
0177Creative Visual Effects

Deep-sea cursor trail effect

Create a pointer trail effect in a deep-sea scene: includes real content, actionable controls, clear state feedback, and layouts across sizes.

Creative Visual EffectsPointer Trail EffectsHTMLCanvasJavaScript
Open and run
0193Creative Visual Effects

Night Garden Interactive Particle Field

Complete an interactive particle field in a night garden scene: includes real content, actionable controls, clear status feedback, and responsive layouts across sizes.

Creative Visual EffectsInteractive Particle FieldHTMLCanvasJavaScript
Open and run
0209Creative Visual Effects

Organic fluid shapes for a Night Garden

Complete organic fluid shapes in a night garden scene: includes real content, interactive controls, clear state feedback, and responsive layout across sizes.

Creative Visual EffectsOrganic Fluid ShapesHTMLCSS AnimationJavaScript
Open and run
0225Creative Visual Effects

Night Garden Gradient Mesh Experiment

Complete the gradient mesh experiment in a night garden scenario: includes real content, interactive controls, clear state feedback, and responsive layouts across sizes.

Creative Visual EffectsGradient Mesh ExperimentHTMLCanvasJavaScript
Open and run
0241Creative Visual Effects

Night Garden Spotlight Stage

Complete a spotlight stage scene in a night garden setting: includes real content, interactive controls, clear status feedback, and responsive layouts across sizes.

Creative Visual EffectsSpotlight StageHTMLCanvasJavaScript
Open and run
0257Creative Visual Effects

Night Garden Multi-Layer Wave Scene

Complete multi-layer wave scenes in a night garden setting: includes real content, interactive controls, clear status feedback, and responsive layouts across sizes.

Creative Visual EffectsMulti-layer Wave SceneHTMLCSS AnimationJavaScript
Open and run
0273Creative Visual Effects

Night Garden Starfield Journey Effect

Complete the starfield traversal effect for a night garden scenario: includes real content, actionable controls, clear status feedback, and responsive layouts across sizes.

Creative Visual EffectsStarfield traversal effectHTMLCanvasJavaScript
Open and run
0289Creative Visual Effects

Night Garden Confetti Burst Effect

Complete a confetti burst effect in a night garden scene: includes real content, interactive controls, clear state feedback, and responsive layouts.

Creative Visual EffectsConfetti Burst EffectHTMLCanvasJavaScript
Open and run
0305Creative Visual Effects

Night garden kaleidoscope pattern

Complete a kaleidoscope pattern in a night garden scenario: include real content, interactive controls, clear state feedback, and responsive layouts.

Creative Visual EffectsKaleidoscope PatternHTMLCanvasJavaScript
Open and run
0321Creative Visual Effects

Night Garden Glass Depth Space

Complete a glass depth-of-field space in a night garden scene: includes real content, interactive controls, clear status feedback, and responsive layout.

Creative Visual EffectsGlass Depth SpaceHTMLCSS GridResponsive Design
Open and run
0337Creative Visual Effects

Night Garden Pointer Trail Effect

Complete the pointer trail effect in a night garden scene: include real content, interactive controls, clear status feedback, and a responsive layout across sizes.

Creative Visual EffectsPointer Trail EffectsHTMLCanvasJavaScript
Open and run
0353Creative Visual Effects

Aurora Field interactive particle field

Complete an interactive particle field in an aurora meadow scene: real content, actionable controls, clear state feedback, and layouts that adapt across sizes.

Creative Visual EffectsInteractive Particle FieldHTMLCanvasJavaScript
Open and run
0368Creative Visual Effects

Aurora Field Organic Fluid Shapes

Complete organic fluid shapes in the aurora field scenario: includes real content, actionable controls, clear status feedback, and responsive layouts.

Creative Visual EffectsOrganic Fluid ShapesHTMLCSS AnimationJavaScript
Open and run
0383Creative Visual Effects

Aurora field gradient mesh experiment

Complete a gradient mesh experiment in an aurora field scene: with real content, interactive controls, clear state feedback, and responsive layouts across sizes.

Creative Visual EffectsGradient Mesh ExperimentHTMLCanvasJavaScript
Open and run
0398Creative Visual Effects

Aurora Field Spotlight Stage

Complete a spotlight stage in an aurora field scene: includes realistic content, interactive controls, clear status feedback, and responsive layouts across sizes.

Creative Visual EffectsSpotlight StageHTMLCanvasJavaScript
Open and run
0412Creative Visual Effects

Aurora field multi-layer wave scene

Complete a multi-layer wave scene in an aurora field scene: includes real content, actionable controls, clear status feedback, and responsive layouts across sizes.

Creative Visual EffectsMulti-layer Wave SceneHTMLCSS AnimationJavaScript
Open and run
0425Creative Visual Effects

Aurora Field Starfield Traversal Effect

Create a starfield journey effect in an aurora field scene: includes real content, interactive controls, clear status feedback, and cross-size layouts.

Creative Visual EffectsStarfield traversal effectHTMLCanvasJavaScript
Open and run
0438Creative Visual Effects

Aurora Field Confetti Burst Effect

A confetti burst effect completed for the Aurora Field scenario: includes real content, actionable controls, clear status feedback, and responsive layouts across sizes.

Creative Visual EffectsConfetti Burst EffectHTMLCanvasJavaScript
Open and run
0451Creative Visual Effects

Aurora Field Kaleidoscope Pattern

Complete a kaleidoscope pattern in an aurora field scenario: includes real content, actionable controls, clear status feedback, and responsive layout across sizes.

Creative Visual EffectsKaleidoscope PatternHTMLCanvasJavaScript
Open and run
0462Creative Visual Effects

Aurora Field Glass Depth Space

Complete the glass depth space in an aurora field scenario: includes real content, actionable controls, clear status feedback, and a responsive layout across sizes.

Creative Visual EffectsGlass Depth SpaceHTMLCSS GridResponsive Design
Open and run
0472Creative Visual Effects

Aurora Field Pointer Trail Effect

Complete a pointer light-trail effect in an aurora field scene: includes real content, actionable controls, clear status feedback, and responsive layouts across sizes.

Creative Visual EffectsPointer Trail EffectsHTMLCanvasJavaScript
Open and run
0480Creative Visual Effects

Interactive particle field in paper space

Complete the interactive particle field in a paper-space setting: includes realistic content, interactive controls, clear status feedback, and responsive layouts.

Creative Visual EffectsInteractive Particle FieldHTMLCanvasJavaScript
Open and run
0488Creative Visual Effects

Organic Fluid Shapes in Paper Space

Complete organic fluid shapes in a paper-space scenario: with real content, actionable controls, clear status feedback, and responsive layouts across sizes.

Creative Visual EffectsOrganic Fluid ShapesHTMLCSS AnimationJavaScript
Open and run
0534Creative Visual Effects

Botanical Lab Confetti Burst Effect

Complete the confetti burst effect for the botanical lab scenario: includes realistic content, actionable controls, clear state feedback, and responsive layouts.

Creative Visual EffectsConfetti Burst EffectHTMLCanvasJavaScript
Open and run
0559Creative Visual Effects

City magazine poetry grid layout

Complete the pointer trail effect in a cloud-lake setting: includes real content, actionable controls, clear state feedback, and a responsive layout across sizes.

Creative Visual EffectsPointer Trail EffectsHTMLCanvasJavaScript
Open and run
0584Creative Visual Effects

Cloud Lake Dome Glass Depth Space

Glass Depth Space in a Cloud Lake Dome scenario: real content, actionable controls, clear state feedback, and responsive layouts across sizes.

Creative Visual EffectsGlass Depth SpaceHTMLCSS GridResponsive Design
Open and run
0609Creative Visual Effects

Cloud Dock Gradient Mesh Experiment

Completed a gradient mesh experiment for a cloud dock scenario: includes real content, actionable controls, clear status feedback, and cross-size layouts.

Creative Visual EffectsGradient Mesh ExperimentHTMLCanvasJavaScript
Open and run
0634Creative Visual Effects

Kaleidoscope Pattern of Cloud Lake Garden

Complete a kaleidoscope pattern in the Cloud Lake Garden scene: with real content, interactive controls, clear state feedback, and responsive layouts across sizes.

Creative Visual EffectsKaleidoscope PatternHTMLCanvasJavaScript
Open and run
0659Creative Visual Effects

Cloud Lake Hall Spotlight Stage

Complete a spotlight stage for a Cloud Lake Hall scenario: includes real content, actionable controls, clear state feedback, and responsive layouts across sizes.

Creative Visual EffectsSpotlight StageHTMLCanvasJavaScript
Open and run
0684Creative Visual Effects

Cloud Harbor Starfield Traverse Effect

Complete the starfield traversal effect in the Cloud Lake Harbor scenario: includes real content, interactive controls, clear status feedback, and responsive layouts.

Creative Visual EffectsStarfield traversal effectHTMLCanvasJavaScript
Open and run
0709Creative Visual Effects

Cloud Lake Observatory Multi-Layer Wave Scenario

Complete the multi-layer wave scene in a cloud observatory scenario: includes real content, interactive controls, clear status feedback, and responsive layouts across sizes.

Creative Visual EffectsMulti-layer Wave SceneHTMLCSS AnimationJavaScript
Open and run
0734Creative Visual Effects

Cloud lake stage confetti burst effect

Complete the confetti burst effect in the cloud lake stage scene: includes real content, actionable controls, clear status feedback, and a cross-size layout.

Creative Visual EffectsConfetti Burst EffectHTMLCanvasJavaScript
Open and run
0759Creative Visual Effects

Cloud Lake Promenade Pointer Trail Effect

Completed the pointer light trail effect in the cloud lake corridor scenario: includes real content, actionable controls, clear state feedback, and cross-size layout.

Creative Visual EffectsPointer Trail EffectsHTMLCanvasJavaScript
Open and run
0784Creative Visual Effects

Coral Dome Glass Depth Space

Complete the glass depth-of-field space in a coral dome scene: includes real content, interactive controls, clear status feedback, and responsive layouts across sizes.

Creative Visual EffectsGlass Depth SpaceHTMLCSS GridResponsive Design
Open and run
0809Creative Visual Effects

Coral Dock Gradient Mesh Experiment

Complete a gradient mesh experiment in a coral dock scene: includes real content, actionable controls, clear status feedback, and a responsive layout across sizes.

Creative Visual EffectsGradient Mesh ExperimentHTMLCanvasJavaScript
Open and run
0834Creative Visual Effects

Coral Garden kaleidoscope pattern

Complete a kaleidoscope pattern in a coral garden scene: includes real content, actionable controls, clear status feedback, and responsive layouts across sizes.

Creative Visual EffectsKaleidoscope PatternHTMLCanvasJavaScript
Open and run
0859Creative Visual Effects

Coral Hall Organic Fluid Shapes

Complete organic fluid shapes for the Coral Hall scenario: includes realistic content, interactive controls, clear status feedback, and responsive layouts across sizes.

Creative Visual EffectsOrganic Fluid ShapesHTMLCSS AnimationJavaScript
Open and run
0884Creative Visual Effects

Coral Harbor Interactive Particle Field

Complete an interactive particle field in the Coral Harbor scene: includes real content, actionable controls, clear state feedback, and responsive layouts across sizes.

Creative Visual EffectsInteractive Particle FieldHTMLCanvasJavaScript
Open and run
0909Creative Visual Effects

Coral observatory spotlight stage

Complete the spotlight stage in a coral observatory scene: includes real content, interactive controls, clear status feedback, and responsive layouts across sizes.

Creative Visual EffectsSpotlight StageHTMLCanvasJavaScript
Open and run
0934Creative Visual Effects

Coral Room Starfield Traverse Effect

Complete the starfield traversal effect in a coral room scene: includes real content, actionable controls, clear status feedback, and responsive layouts.

Creative Visual EffectsStarfield traversal effectHTMLCanvasJavaScript
Open and run
0959Creative Visual Effects

Coral Stage Multi-layer Wave Scene

Create a multilayer wave scene in a coral stage setting: includes real content, interactive controls, clear state feedback, and responsive layouts.

Creative Visual EffectsMulti-layer Wave SceneHTMLCSS AnimationJavaScript
Open and run
0984Creative Visual Effects

Coral corridor confetti burst effect

Complete the confetti burst effect for the coral tunnel scenario: include real content, interactive controls, clear state feedback, and cross-size layouts.

Creative Visual EffectsConfetti Burst EffectHTMLCanvasJavaScript
Open and run
1009Creative Visual Effects

Desert Station Cursor Trail Effect

Complete a pointer light-trail effect for the desert station scenario: include real content, interactive controls, clear status feedback, and cross-size layouts.

Creative Visual EffectsPointer Trail EffectsHTMLCanvasJavaScript
Open and run
1034Creative Visual Effects

Echo Hall Glass Depth Space

Complete the glass depth space for the Echo Hall scenario: includes real content, interactive controls, clear state feedback, and responsive layouts across sizes.

Creative Visual EffectsGlass Depth SpaceHTMLCSS GridResponsive Design
Open and run