Daisy Wave

A gradient shader effect displaying a dense grid of asterisk-like symbols (*) arranged in rows and columns against a dark background. The symbols transition through a color gradient from bright golden yellow (#ffd700) on the left side to progressively warmer orange and reddish tones (#ff6b35) toward the right side, creating a smooth chromatic transition. The background is a very dark purple-black (#1a0f2e), providing high contrast. The symbols appear to fade and become less visible toward the right edge, suggesting a mask or opacity gradient following a sine wave pattern at an 288-degree angle. The overall effect creates a sense of depth and movement, with the wavy distortion pattern visible in how the symbol density and color intensity shift across the composition. A subtle film grain texture overlays the entire image at 12% strength, adding a slight noise characteristic. The spacing between symbols is uniform and consistent, creating a regular grid pattern that emphasizes the smooth color and opacity transitions. The mood is atmospheric and digital, with a warm color palette that evokes heat or energy flowing from left to right.

<script setup lang="ts">
import {
  Shader,
  Ascii,
  FilmGrain,
  Group,
  SineWave,
  SolidColor
} from 'shaders/vue'
</script>

<template>
  <Shader
    :disable-telemetry="true"
  >
    <SolidColor color="#1a0f2e" />
    <Group blend-mode="normal-oklch">
      <SolidColor color="#ff6b35" :visible="true" />
      <SineWave id="idmh10tevmvxufaxu22" :amplitude="0.42" :angle="288" color="#ffd700" :frequency="0.51" :position="{ x: 0.2, y: 0.15 }" :softness="0.52" :thickness="0.99" :visible="true" />
      <Ascii :cell-size="38" characters="〜*" font-family="Space Mono" mask-source="idmh10tevmvxufaxu22" :visible="true" />
    </Group>
    <FilmGrain :strength="0.12" />
  </Shader>
</template>