Neon Sign 2

A neon cross or plus sign symbol rendered with a glowing cyan-to-purple gradient outline against a pure black background. The cross features sharp right angles with smooth curved corners, creating a modern geometric appearance. The neon effect produces a bright cyan core (#00bbff) with an intense turquoise glow (#00ddff) that radiates outward, creating a halo effect around the entire shape. The glow has a soft, diffused quality with approximately 0.47 radius spread. The outline appears to have a tube-like thickness of about 0.29 units, giving it dimensional depth. A secondary purple color (#9000ff) blends subtly into the edges, creating a color gradient from cyan to purple. The neon exhibits subtle flickering and light variations with a hot core intensity that makes the center brighter than the edges. Fine floating particles with cyan coloration (#0ee8e8) drift slowly around the shape at various angles, adding atmospheric depth. A tilt-shift blur effect is applied at a 70-degree angle with moderate falloff, creating a slight depth-of-field effect that enhances the three-dimensional appearance. The overall mood is futuristic, digital, and energetic with a cyberpunk aesthetic. The black background provides maximum contrast, making the luminous neon effect appear to float in darkness.

Code

vue

<script setup lang="ts">
import {
  Shader,
  FloatingParticles,
  ImageTexture,
  Neon,
  SolidColor,
  TiltShift
} from 'shaders/vue'
</script>

<template>
  <Shader
    :disable-telemetry="true"
  >
    <ImageTexture url="https://data.shaders.com/storage/v1/object/public/user-uploaded-images/user_33nh0FG48zZa0rIUZuK7vgwPfZe/h7eBDklfg_bz.jpeg" />
    <SolidColor color="#000000" :opacity="0.95" />
    <Neon color="#00bbff" :corner-smoothing="0.2" :flicker-amount="0.24" :flicker-speed="1.1" :flow-amount="1" :flow-speed="2.6" :glow-intensity="0.25" :glow-radius="0.47" :hot-core-intensity="0.45" :intensity="1.95" :light-angle="251" :scale="0.9" :secondary-blend="1" secondary-color="#9000ff" shape-sdf-url="https://data.shaders.com/storage/v1/object/public/user-uploaded-images/user_33nh0FG48zZa0rIUZuK7vgwPfZe/w6Gk_KBfIO2t_sdf.bin" :specular-intensity="0.95" :specular-size="0.32" :tube-thickness="0.29" />
    <FloatingParticles :angle="81" :angle-variance="105" particle-color="#0ee8e8" :particle-density="0.8" :particle-size="0.3" :randomness="0.5" :speed="0.1" :speed-variance="0.2" :twinkle="0.7" />
    <TiltShift :angle="70" :falloff="0.4" :intensity="80" :width="0.2" />
  </Shader>
</template>