Shaders
header.lightDarkMode D
Gallery

Converging Panels 9

Converging Panels

A radial gradient shader effect dominated by deep crimson red tones transitioning from darker burgundy at the edges to brighter scarlet toward the center. The composition features a soft, diffused lighting setup with a studio background aesthetic. Two bright diagonal light streaks emanate from the upper right quadrant, creating a luminous glow effect that suggests studio lighting or spotlight illumination. The kaleidoscope component with 6 segments creates subtle symmetrical distortions in the light rays, producing a mirrored pattern effect. A fine film grain texture overlays the entire composition at 0.2 strength, adding subtle noise and a cinematic quality. The center point is positioned at the bottom-right corner (originX: 1, originY: 1) with mouse-tracking capability, creating dynamic light movement. The overall mood is warm, dramatic, and theatrical with high ambient intensity (96) and moderate brightness (20), producing a professional studio lighting simulation with soft falloff and vignetting effects.

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: 1, originY: 1, momentum: 0.3, smoothing: 0.4 }" color="#ff191d" :fill-angle="72" :fill-intensity="9" :key-intensity="38" :wall-curvature="35" />
    <Kaleidoscope :center="{ type: 'mouse-position', reach: 0.05, originX: 1, originY: 1, momentum: 0.5, smoothing: 0.5 }" />
    <FilmGrain :strength="0.2" />
  </Shader>
</template>