Soft Prism 3

A sophisticated gradient shader effect featuring layered geometric and organic elements. The composition displays a dynamic color gradient transitioning from cyan and light-blue in the upper left, through purple and magenta in the center, to yellow and dark-green in the lower right, creating a vibrant rainbow spectrum. Three semi-transparent curved geometric shapes (appearing as partial spheres or crescents) are positioned left of center, rendered in dark-blue and purple tones with soft edges and depth. A large luminous sphere dominates the center-right area, featuring a soft pink-to-lavender gradient with subtle internal lighting and a glossy appearance suggesting refraction and fresnel effects. The background contains flowing, blurred organic shapes that suggest wave distortions and blob-like formations. A subtle sine wave pattern runs horizontally across the composition in dark tones. The overall effect is enhanced by chromatic aberration, soft focus areas, and film grain texture overlay. The lighting creates a sense of depth with highlights suggesting a light source positioned above and to the right. The atmosphere is modern, ethereal, and digitally sophisticated with smooth color transitions and soft, glowing edges throughout.

Code

vue

<script setup lang="ts">
import {
  Shader,
  Blob,
  CursorRipples,
  FilmGrain,
  Glass,
  SineWave,
  Swirl,
  WaveDistortion
} from 'shaders/vue'
</script>

<template>
  <Shader
    :disable-telemetry="true"
  >
    <Swirl color-a="#250436" color-b="#02dbc4" color-space="lch" :detail="2.5" :speed="0.8" />
    <Blob :center="{ x: 0.27, y: 0.85 }" color-a="#ffff00" color-b="#6e00ff" color-space="oklch" :deformation="1" highlight-color="#ffffff" :highlight-intensity="0.8" :highlight-x="0.5" :highlight-y="-0.5" :highlight-z="0.8" :opacity="0.9" :seed="42" :size="0.85" :softness="3" :speed="1.2" :visible="true" />
    <WaveDistortion :angle="161" edges="mirror" :frequency="3.4" :speed="2.5" :strength="0.2" :visible="true" />
    <SineWave :amplitude="0.1" :angle="97" color="#0f121f" :frequency="0.5" :position="{ x: 1, y: 0.5 }" :softness="1" :speed="-0.6" :thickness="2.2" :visible="true" />
    <CursorRipples :intensity="5" :radius="2" :visible="true" />
    <Glass :aberration="1" :center="{ x: 0.3, y: 0.5 }" :fresnel="0" :fresnel-softness="0.31" :highlight="0.1" highlight-color="#dbe6ff" :highlight-softness="0.27" :inner-zoom="1.15" :light-angle="289" :refraction="0.74" :scale="0.7" shape-sdf-url="https://data.shaders.com/storage/v1/object/public/user-uploaded-images/user_33nh0FG48zZa0rIUZuK7vgwPfZe/ELSMA8FfCFXr_sdf.bin" :thickness="1" :visible="true" />
    <FilmGrain :strength="0.1" :visible="true" />
  </Shader>
</template>