Ribbon Flows 6
Ribbon FlowsA smooth, flowing gradient shader effect dominated by warm orange and peachy tones. The composition features a diamond gradient that transitions from a light cream/beige color (#f7d4bc) in the center-upper area to a vibrant burnt orange (#f04700) at the edges. The effect creates soft, organic wave-like curves that flow diagonally across the canvas, suggesting movement and fluidity. The gradient has a subtle radial quality with smooth blending and no harsh edges. A fine film grain texture is overlaid throughout, adding subtle noise and texture to the otherwise smooth surface. The overall atmosphere is warm, inviting, and slightly ethereal, with the soft edges and transparency creating a sense of depth. The lighting appears to come from the upper-left area, creating gentle highlights that enhance the three-dimensional quality of the flowing forms. The effect has a modern, minimalist aesthetic with emphasis on color harmony and smooth transitions rather than sharp geometric shapes.
Code
<script setup lang="ts">
import {
Shader,
DiamondGradient,
FilmGrain,
SineWave
} from 'shaders/vue'
</script>
<template>
<Shader
:disable-telemetry="true"
>
<SineWave id="idmnwkl123sccj082v5" :amplitude="0.1" :angle="28" :frequency="0.7" :softness="0.5" :speed="0.8" :thickness="0.5" :visible="false" />
<DiamondGradient :center="{ type: 'mouse-position', reach: 0.2, originX: 0.5, originY: 0.5, momentum: 0.2, smoothing: 0.65 }" color-a="#f7d4bc" color-b="#f04700" color-space="hsl" :rotation="{ type: 'map', curve: 1, source: 'idmnwkl123sccj082v5', channel: 'alpha', inputMax: 1, inputMin: 0, outputMax: 360, outputMin: 0 }" :size="1.04" />
<FilmGrain :strength="0.3" />
</Shader>
</template>