Drifting Lights 8

A dark, minimalist shader effect displaying a subtle horizontal linear gradient transitioning from a slightly warmer dark blue-gray (#212538) on the left to a cooler, deeper dark navy (#171b1f) on the right. The gradient is smooth and uniform across the entire canvas. Overlaid on this base gradient is a barely perceptible rectangular coordinate grid pattern that creates a subtle geometric structure with faint horizontal and vertical lines, scaled at 3x intensity but maintaining very low visibility due to the dark background. The entire composition is finished with a fine film grain texture at 0.1 strength, adding a subtle noise pattern that creates a cinematic, slightly textured appearance. The effect has a calm, professional, and atmospheric quality with no bright highlights or sharp contrasts. The overall mood is dark, sophisticated, and minimalist with a technical, digital aesthetic.

Code

vue

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

<template>
  <Shader
    :disable-telemetry="true"
  >
    <LinearGradient :angle="{ mode: 'loop', type: 'auto-animate', speed: 1, easing: 'linear', outputMax: 360, outputMin: 0 }" color-a="#212538" color-b="#171b1f" color-space="oklab" />
    <RectangularCoordinates edges="stretch" :scale="3" />
    <FilmGrain :strength="0.1" />
  </Shader>
</template>