FreeEffects and animation

Smoke Ring

Polar-coordinate smoke ring procedural background — radial multi-colored gradient distorted by two phase-shifted FBM noise layers that cross-fade so the smoke never visibly loops, with tunable radius / thickness / inner fill / noise iterations

Free
Free with a ShipSwift account.

Copies a short instruction with your private download link. Paste it into your agent: it downloads the whole skill (the source code, the setup steps and the mistakes we already made for you) and builds the screen.

Works with

+70

What it does

Programmatic background of a radial multi-colored ring distorted by layered noise. Ring shape is built in polar coordinates from length and atan2; two phase-shifted FBM noise layers (1...8 octaves of procedural value noise) cross-fade over a 3-second cycle so the smoke perpetually re-rolls without visible looping; the noise warps the polar UV so the ring's silhouette billows. A procedural hash21 keeps the shader fully self-contained (no sampler / no resource binding).

Requires iOS 18+ / macOS 15+ (SwiftUI ShaderLibrary / Shader / Metal stitchable).

What you get

  • ✓563 lines of source code, ready to paste
  • ✓File Layout
  • ✓Source Code
animationmetalshaderSwiftUI

More in Effects and animation

Metal shaders: fields of dots that roll like waves and flow into living patterns, all drawn on the GPU.
Metal dot fields
Free
Metal shaders: fields of dots that roll like waves and flow into living patterns, all drawn on the GPU.
Details
A deep-space starfield in Metal: glowing nebulae drift past twinkling stars.
Deep-space starfield
Free
A deep-space starfield in Metal: glowing nebulae drift past twinkling stars.
Details
Neon outlines that bloom from the center with prism-colored edges, rendered live in Metal.
Neon outlines
Free
Neon outlines that bloom from the center with prism-colored edges, rendered live in Metal.
Details
Colored blobs that drift, melt into one another like liquid, and blend their colors as they merge.
Liquid metaballs
Free
Colored blobs that drift, melt into one another like liquid, and blend their colors as they merge.
Details
A 3D network graph you can spin. Tap any node and its links light up, with the details below.
3D network graph
Free
A 3D network graph you can spin. Tap any node and its links light up, with the details below.
Details
Items orbit into a dotted ring, and payment cards fan out of a wallet as the balance rolls in.
Orbit ring and wallet
Free
Items orbit into a dotted ring, and payment cards fan out of a wallet as the balance rolls in.
Details
A field of bright colored dots that float and shimmer across the whole screen.
Floating color dots
Free
A field of bright colored dots that float and shimmer across the whole screen.
Details
Stacked glass panels in mirrored layers, with neon gradients flowing through them.
Glass color panels
Free
Stacked glass panels in mirrored layers, with neon gradients flowing through them.
Details
Drag the slider and scattered points of light pull together into a perfect 3D sphere.
Dot sphere
Free
Drag the slider and scattered points of light pull together into a perfect 3D sphere.
Details
Living patterns: a mosaic of cells that keeps reshaping, then a hypnotic color swirl.
Cells and swirl
Free
Living patterns: a mosaic of cells that keeps reshaping, then a hypnotic color swirl.
Details
Organic noise shaders: glowing veins that pulse through the dark, then bold color blobs in constant flow.
Noise veins and blobs
Free
Organic noise shaders: glowing veins that pulse through the dark, then bold color blobs in constant flow.
Details
All 46 skills in Effects and animation