Shaders
header.lightDarkMode D
Gallery

Swirled Lenses 12

Swirled Lenses

A dynamic gradient shader effect featuring smooth, undulating wave patterns that flow diagonally across the composition. The primary visual effect combines a swirl component with a fluted glass overlay, creating a sense of depth and movement. The waves are rendered with vertical linear striations that create a ribbed or corrugated texture, giving the impression of looking through ridged glass or fabric. The color palette transitions smoothly from warm orange tones on the left and upper portions to deeper red tones on the right and lower portions, with the blend occurring at approximately 50% opacity. The fluted glass effect adds subtle refraction and highlights, with a white highlight accent visible throughout the wave pattern, particularly pronounced along the ridge peaks. The overall effect suggests flowing liquid or fabric with a glossy, reflective surface. The wave frequency is set high (11), creating numerous parallel ridges that run at a 157-degree angle, while the refraction value of 3.37 produces noticeable distortion and light-bending effects. The softness parameter of 1 ensures smooth transitions between the ridges, and the waveform creates a gentle, organic undulation rather than sharp geometric patterns. The atmosphere is warm and energetic, with the interplay of light and shadow suggesting a three-dimensional, tactile surface.

Code

vue
<script setup lang="ts">
import {
  Shader,
  FlutedGlass,
  Swirl
} from 'shaders/vue'
</script>

<template>
  <Shader
    :disable-telemetry="true"
  >
    <Swirl color-a="#ff7a3d" color-b="#c41e1e" color-space="oklab" :detail="2" />
    <FlutedGlass :aberration="0.3" :angle="157" :frequency="11" :highlight="2" :highlight-softness="0.11" :light-angle="-90" :refraction="3.37" shape="waves" :softness="1" :wave-amplitude="0.1" :wave-frequency="0.5" />
  </Shader>
</template>