Dither Logo 4

A vibrant gradient background transitioning from bright yellow in the top-left corner through warm orange tones in the center to golden-yellow in the top-right, creating a warm, energetic atmosphere. Overlaid on this background is a stylized logo composed of four geometric shapes arranged in a 2x2 grid pattern. The logo features cream/pale yellow colored outlines forming circular and rounded rectangular shapes. The shapes are filled with the radial gradient background (red to orange), creating a cohesive visual effect. A dynamic plasma effect with magenta and lime-green colors subtly animates through the logo shapes, visible as organic, flowing distortions. A fine dithering pattern with white pixels on a bayer8 pattern is applied with linear dodge blending, adding a grainy, textured quality that enhances the digital aesthetic. The overall composition has a modern, energetic feel with smooth color transitions and subtle animated distortions that suggest movement and vitality.

Code

vue

<script setup lang="ts">
import {
  Shader,
  Dither,
  ImageTexture,
  Plasma,
  RadialGradient
} from 'shaders/vue'
</script>

<template>
  <Shader
    :disable-telemetry="true"
  >
    <ImageTexture id="idmmaykb1vflvohydj1" object-fit="contain" :transform="{ scale: 0.6 }" url="https://data.shaders.com/storage/v1/object/public/user-uploaded-images/user_33nh0FG48zZa0rIUZuK7vgwPfZe/c42DCkk-W-da.svg" :visible="false" />
    <RadialGradient color-a="#fb150f" color-b="#ffa704" color-space="oklab" />
    <Plasma :balance="63" color-a="#f316e8" color-b="#93fa71" color-space="hsl" :contrast="2.6" :density="1.7" :intensity="3" mask-source="idmmaykb1vflvohydj1" />
    <Dither blend-mode="linearDodge" color-mode="source" pattern="bayer8" :pixel-size="2" :threshold="0.96" />
  </Shader>
</template>