Shaders
header.lightDarkMode D
Gallery

Spectral Bloom 3

Spectral Bloom

Code

vue
<script setup lang="ts">
import {
  Shader,
  ColorWheel,
  Halftone,
  SunBurst
} from 'shaders/vue'
</script>

<template>
  <Shader
    :disable-telemetry="true"
  >
    <SunBurst id="idmpcwxhawsfhikefj9" background="#00000000" :center="{ type: 'mouse-position', reach: 0.05, invertX: false, invertY: false, originX: 0.8061630218687873, originY: 0.7676678445229682, momentum: 0.25, smoothing: 0.45 }" color="#ffffff" :feather="2.18" :radius="2" :ray-count="8" :softness="0.9" :speed="0" :visible="false" />
    <ColorWheel :angle="{ mode: 'loop', type: 'auto-animate', speed: 0.2, outputMax: 180, outputMin: -180 }" color-a="#00ff80" color-b="#00ffd9" color-c="#000000" color-space="oklab" mode="custom" :scale="{ type: 'map', source: 'idmpcwxhawsfhikefj9', channel: 'alpha', inputMax: 1, inputMin: 0, outputMax: 10, outputMin: 0.1 }" />
    <Halftone :frequency="125" :misprint="0.0055" :opacity="0.05" style="cmyk" />
  </Shader>
</template>