Flowing Ribbon 6
Flowing RibbonA vertically-oriented 3D ribbon form dominates the center of the composition, featuring a smooth, curved surface with high glossiness and reflective properties. The ribbon displays a striking color gradient transitioning from vibrant lime-green (#c8f067) on the outer edges to deep purple (#5f2bde) in the central core, creating a dramatic color separation. The form has a subtle twist applied to its geometry, giving it an organic, flowing appearance. Overlaid on the 3D ribbon are thin white vertical lines with a linear dodge blend mode, creating bright accent streaks that enhance the sense of depth and movement. The lines have a trail effect with moderate length, suggesting downward motion. The background is a soft, muted lavender-gray (#dad6ff) with gentle studio lighting that creates subtle shadows and depth perception. The overall atmosphere is modern and polished, with a smooth gradient transition between the bright green and deep purple creating visual tension. Film grain texture is subtly applied across the entire composition at low opacity, adding a slight cinematic quality. The lighting is positioned to emphasize the 3D form's curvature and reflective surface, with ambient lighting contributing to the ethereal quality of the scene.
Code
<script setup lang="ts">
import {
Shader,
FallingLines,
FilmGrain,
Form3D,
StudioBackground,
Swirl
} from 'shaders/vue'
</script>
<template>
<Shader
:disable-telemetry="true"
>
<StudioBackground :ambient-intensity="78" :brightness="100" :center="{ x: 0.75, y: 1 }" color="#dad6ff" :fill-intensity="0" :key-intensity="0" :light-target="0" :wall-curvature="57" />
<Form3D :center="{ x: 0.5, y: 0 }" :glossiness="200" :lighting="197" :shape3d="{ type: 'ribbon', angle: 89, twist: 24, width: 100, thickness: 500, seed: 0 }" :speed="2" :zoom="78">
<Swirl color-a="#5f2bde" color-b="#c8f067" color-space="oklab" :detail="1.9" />
<FallingLines :angle="0" blend-mode="linearDodge" color-b="#000000" :density="12" :stroke-width="0.1" :trail-length="0.72" />
</Form3D>
<FilmGrain :strength="0.3" />
</Shader>
</template>