Shaders
header.lightDarkMode D
Gallery

A dynamic organic blob effect centered in the upper-left quadrant of the composition against a dark forest green background (#041c12). The blob features a smooth, amorphous shape with soft, feathered edges that gradually fade into transparency. The primary blob coloration transitions from a bright cyan-turquoise (#96efe3) on the left side to a vibrant lime-green (#3eb94a) on the right side, creating a fluid color gradient. A prominent bright yellow highlight (#ffe11a) is positioned in the upper-right area of the blob, creating a glossy, luminous focal point with moderate intensity. The blob exhibits significant organic deformation with undulating, wave-like surface variations that suggest movement and fluidity. A subtle film grain texture overlay adds a grainy, slightly noisy quality across the entire composition at low opacity (0.1), enhancing the organic, natural feel. The overall atmosphere is cool-toned and ethereal, with the glowing blob appearing to float against the dark background, creating a sense of depth and dimensionality through soft focus and transparency gradients.

Code

vue
<script setup lang="ts">
import {
  Shader,
  Blob,
  FilmGrain,
  SolidColor
} from 'shaders/vue'
</script>

<template>
  <Shader
    :disable-telemetry="true"
  >
    <SolidColor color="#041c12" />
    <Blob :center="{ x: 0.08, y: 0.23 }" color-a="#96efe3" color-b="#3eb94a" color-space="oklab" :deformation="5" :seed="39" :size="1.35" :softness="2" />
    <FilmGrain :strength="0.1" />
  </Shader>
</template>