Halftone Swirl 2
Halftone SwirlA gradient shader effect transitioning from dark blue at the top to bright lime green at the bottom. The entire composition is overlaid with a halftone dot pattern at 45-degree angle, creating a textured, pixelated appearance throughout. The halftone dots are uniform in distribution with fine smoothness, giving a mechanical, printed quality. The dark blue base color (#042b52) occupies the upper two-thirds of the image, while the lime green (#5ded15) swirl effect emerges from the bottom third, creating a diagonal wave-like transition. The swirl component blends the bright green with darker green undertones (#0b592f), producing subtle color variation within the gradient. The halftone pattern maintains consistent frequency across the entire surface, with dots becoming more visible in the lighter green areas due to contrast. The overall mood is modern and digital, with a tech-forward aesthetic. The effect creates depth through the layering of the solid color base, halftone texture, and swirl gradient, resulting in a sophisticated, multi-dimensional appearance.
Code
<script setup lang="ts">
import {
Shader,
Halftone,
SolidColor,
Swirl
} from 'shaders/vue'
</script>
<template>
<Shader
:disable-telemetry="true"
>
<SolidColor color="#042b52" />
<Halftone :smoothness="0.05">
<Swirl :coarse-x="50" :coarse-y="50" color-a="#5ded15" color-b="#0b592f" :fine-x="50" :fine-y="50" :medium-x="50" :medium-y="50" />
</Halftone>
</Shader>
</template>