Skip to content
Get packs

Corner Laser Effects

Adds thin, glowing corner-anchored laser beams with bloom and haze to web designs

Source Download skill
Repository
MengTo/Skills
Stars
7,187
Licence
MIT
Files
3 files

What it does

This skill teaches an AI agent how to build a decorative visual effect: two or three thin, sharp beams of light that meet at a bright point near a corner of a page or section, with a soft glow and atmospheric haze around that point. Once installed, when you ask for a laser-style or portal-seam background, the agent will follow these visual and technical rules, using your design's main accent color instead of a fixed blue. The skill is focused on this one look and tells the agent to avoid centered or generic laser designs.

Great for

  • Web designers who want a cinematic, corner-based hero background or accent
  • Front-end developers building WebGL or shader-based landing page effects
  • Teams whose design already has a clear primary accent color they want reused in the glow

Skip it if

  • Simple flat layouts or accessibility-first pages, since the glow and motion may distract or wash out UI text (the skill itself warns about this)
  • Projects that need centered or particle-based effects, which the skill explicitly says are out of scope
  • Sites with no WebGL support in mind, since the preferred approach relies on raw WebGL shader code when the output supports it

Try asking

  • “Create a corner-anchored laser composition with thin beams and a glowing emitter for my hero section”
  • “Add a subtle laser portal seam in the top-right corner of this landing page using my brand accent color”
  • “Build a restrained shader background with three beams meeting at the bottom-left corner and soft fog”
Step-by-step guide: how to use Corner Laser EffectsInstall, first run, examples, tips and FAQs

Install in 3 steps

  1. 1

    Download the skill

    The ZIP contains the 3 original files, the MIT licence and an attribution note.

    corner-lasers.zip
  2. 2

    Add it to your agent

    Claude Code (all projects)

    mkdir -p ~/.claude/skills && unzip corner-lasers.zip -d ~/.claude/skills/

    Claude Code / Agent SDK (this project only)

    mkdir -p .claude/skills && unzip corner-lasers.zip -d .claude/skills/

    Claude apps (web/desktop): Settings → Capabilities → Skills → Upload skill, and choose the ZIP.

  3. 3

    Ask for the task

    No special command needed — the agent reads the skill's description and loads it when your request matches. Try one of the prompts above.

Get better results

  • Name your design's primary accent color so the agent derives the halo and haze tint from it rather than defaulting to blue
  • Ask for the emitter to be placed off-center (for example, a corner) and check that the UI text stays readable over the glow
  • Request restrained motion such as slow pulsing so the effect does not become chaotic flicker

What's inside

  • demo/PROMPT.md
  • demo/source.json
  • SKILL.md

Redistributed unmodified from MengTo/Skills under the MIT licence. The assessment was drafted with AI from the skill's files on 2026-10-29. Skills can instruct your agent to run code — read SKILL.md and any scripts before installing.