Converging Panels 5

A warm, organic shader effect dominated by soft golden-brown tones with subtle directional lighting. The primary StudioBackground component creates a warm amber base (#ff911c) with sophisticated lighting simulation. The effect features soft, diffused shadows and highlights that suggest three-dimensional form, with darker brown areas concentrated in the upper-left and right portions creating depth. A subtle kaleidoscopic pattern with 6 segments is layered underneath, though heavily subdued by the dominant background, creating faint geometric symmetry that's barely perceptible. The overall composition has a luminous quality with high ambient intensity (96), creating a soft, studio-like lighting environment. Fine film grain texture (0.2 strength) is applied across the entire surface, adding subtle noise and tactile quality. The lighting appears to originate from approximately the center-right area (originX: 0.639, originY: 0.775), creating a gentle vignette effect without harsh edges. The blend mode of 'luminosity' for the background preserves the warm color while allowing subtle tonal variations. The effect has a smooth, almost fabric-like appearance with warm highlights and cooler shadow areas, suggesting a three-dimensional curved surface with professional studio lighting.

Code

vue

<script setup lang="ts">
import {
  Shader,
  FilmGrain,
  Kaleidoscope,
  StudioBackground
} from 'shaders/vue'
</script>

<template>
  <Shader
    :disable-telemetry="true"
  >
    <StudioBackground :ambient-intensity="96" :ambient-speed="3" :back-intensity="0" :back-softness="0" blend-mode="luminosity" :center="{ type: 'mouse-position', reach: 0.7, originX: 0.6390374331550802, originY: 0.7749603803486529, momentum: 0.3, smoothing: 0.4 }" color="#ff911c" :fill-angle="72" :fill-intensity="9" :key-intensity="38" :wall-curvature="35" />
    <Kaleidoscope :center="{ type: 'mouse-position', reach: 0.05, originX: 0.7335115864527629, originY: 0.8605388272583201, momentum: 0.5, smoothing: 0.5 }" />
    <FilmGrain :strength="0.2" />
  </Shader>
</template>