Liquid Stripes 4
Liquid StripesA diagonal striped background pattern with 45-degree angled lines in alternating yellow-green (#b8c911) and coral-red (#d06755) colors. The stripes are evenly spaced with a density of 9, creating a rhythmic linear pattern across the entire composition. Overlaid on this striped foundation is a central frosted glass effect featuring a radial starburst or flower-like shape composed of translucent rectangular segments arranged in a circular pattern. The glass element exhibits significant refraction and chromatic aberration effects, creating a prismatic quality with subtle rainbow-like color shifts along the edges. The glass shape has a blur value of 11.3 pixels, producing a soft, diffused appearance with visible fresnel highlights and edge softness of 0.1. The overall composition is enhanced with cursor ripple distortions that create concentric wave patterns emanating from interaction points, with a decay of 10 and intensity of 10. A subtle film grain texture with 0.3 strength is applied across the entire image, adding a fine noise texture that enhances the tactile quality. The lighting angle is set to 300 degrees, creating directional highlights on the glass element. The atmosphere is modern and digital, with a warm coral-to-yellow color palette suggesting energy and motion.
Code
<script setup lang="ts">
import {
Shader,
CursorRipples,
FilmGrain,
Glass,
Stripes
} from 'shaders/vue'
</script>
<template>
<Shader
:disable-telemetry="true"
>
<Stripes :balance="0.1" color-a="#b8c911" color-b="#d06755" :density="9" />
<CursorRipples />
<Glass :blur="11.3" :fresnel="0.11" :fresnel-softness="0.38" :refraction="0.51" shape-sdf-url="https://data.shaders.com/storage/v1/object/public/user-uploaded-images/user_33nh0FG48zZa0rIUZuK7vgwPfZe/DODKZwnr2rPw_sdf.bin" :thickness="0.13" />
<FilmGrain :strength="0.3" />
</Shader>
</template>