skillfed

postfx-bloom

postfx-bloom delivers post-processing bloom effects for 3D rendering pipelines. Configure bloom intensity, threshold, and blur radius to create glowing highlights and atmospheric lighting. Ideal for games and interactive visualizations seeking polished visual enhancement.

postfx-bloom applies post-processing bloom effects to your 3D scene by rendering bright pixels with a glow. Configure the bloom intensity, threshold, and blur radius to control which objects glow and how strong the effect appears. Objects with emissive materials or high brightness values will naturally bloom when the threshold is set appropriately.

AI-generated summary based on this skill's SKILL.md

8 3 MIT updated by Bbeierle12

Install

Bbeierle12/Skill-MCP-Claude/postfx-bloom · repository language: JavaScript

CLI (skillfed)coming soon
git clone https://github.com/Bbeierle12/Skill-MCP-Claude
cp -r Skill-MCP-Claude/skills/postfx-bloom ~/.claude/skills/postfx-bloom

Frequently asked questions

AI-generated answers based on this skill's SKILL.md and metadata

How do I add glow to 3D objects with postfx-bloom?

postfx-bloom applies post-processing bloom effects to your 3D scene by rendering bright pixels with a glow. Configure the bloom intensity, threshold, and blur radius to control which objects glow and how strong the effect appears. Objects with emissive materials or high brightness values will naturally bloom when the threshold is set appropriately.

Can postfx-bloom create neon and cyberpunk aesthetic lighting?

Yes, postfx-bloom excels at creating neon and cyberpunk aesthetics. By adjusting the threshold to isolate bright colors and increasing blur radius and intensity, you can achieve vivid glowing neon effects. Pair it with emissive materials in vibrant colors for authentic cyberpunk lighting that makes UI elements and accent lights pop.

How does selective bloom work for specific meshes in postfx-bloom?

postfx-bloom supports selective bloom by targeting specific objects through luminance thresholding. Objects with brightness values above your configured threshold will bloom independently. You can also use render layers or material properties to control which meshes contribute to the bloom effect, enabling fine-grained visual control.

What's the best way to optimize postfx-bloom on mobile devices?

postfx-bloom offers mobile optimization through reduced blur radius, lower resolution render targets, and adjusted intensity values. Lower the threshold to reduce processing overhead, use smaller blur kernels, and consider disabling bloom on lower-end devices. These settings maintain visual quality while keeping performance acceptable on mobile hardware.

Can I animate postfx-bloom intensity with audio or time?

postfx-bloom supports dynamic animation of bloom parameters. You can bind intensity, threshold, or blur radius to audio frequencies for reactive effects, or use time-based functions for pulsing animations. This enables creative effects like energy pulses, cosmic glows, and audio-synchronized visual feedback in interactive experiences.

What license does postfx-bloom use?

postfx-bloom is released under the MIT license, allowing free use, modification, and distribution in both open-source and commercial projects with minimal restrictions.

SKILL.md

rendered from the published skill — quoted content, verbatim

Post-Processing Bloom

Bloom effects using UnrealBloomPass for luminance-based glow and selective object bloom.

Quick Start

npm install three @react-three/fiber @react-three/postprocessing
import { Canvas } from '@react-three/fiber';
import { EffectComposer, Bloom } from '@react-three/postprocessing';

function Scene() {
  return (
    <Canvas>
      <mesh>
        <sphereGeometry args={[1, 32, 32]} />
        <meshStandardMaterial emissive="#00F5FF" emissiveIntensity={2} />
      </mesh>

      <EffectComposer>
        <Bloom
          luminanceThreshold={0.2}
          luminanceSmoothing={0.9}
          intensity={1.5}
        />
      </EffectComposer>
    </Canvas>
  );
}

Core Concepts

How Bloom Works
  1. Threshold — Pixels brighter than threshold are extracted
  2. Blur — Extracted pixels are blurred in multiple

(truncated - see the full file via the links below)

Read as markdown · JSON record · Browse the source repository

File tree — 2 files
skills/postfx-bloom/SKILL.md
skills/postfx-bloom/_meta.json

Related skills

Tags

post-processing-effects visual-aesthetics performance-tuning interactive-animation material-properties real-time-graphics gpu-optimization creative-coding light-simulation shader-techniques