Guide · Agent skill
How to use the Corner Laser Effects agent skill
Updated · written with AI from the project's own documentation and checked against our catalogue data
The corner-lasers skill is a set of instructions that teaches an AI agent to build one specific decorative effect: two or three thin beams of light meeting at a bright emitter near a corner of a page or section, surrounded by soft glow and haze. This guide explains what the skill does, how to install it, how to ask for the effect in plain language, and what to check before you ship the result. By the end you will be able to add the skill to your agent and request a corner laser background tuned to your own accent color.
Corner Laser EffectsMengTo/Skills · MIT Download the skill Quick start
- 1Download the ZIP. Get the corner-lasers ZIP from this page.
- 2Unzip into a skills folder. Extract it into ~/.claude/skills/ for personal use, or into a project's .claude/skills/ folder.
- 3Or upload in the Claude apps. Go to Settings → Capabilities → Skills and upload the ZIP.
- 4Describe the corner laser look. Ask for beams meeting at a corner, name the placement and your accent color, and mention the page or section it sits behind.
- 5Check the output. Open the result and confirm the emitter is the brightest point and the text remains readable.
- 6Adjust the tuning. Ask the agent to change corner position, beam count, bloom, fog or vignette if the balance is off.
What the corner-lasers skill makes the agent do
An agent skill is a folder of instructions that an AI agent reads when your request matches the skill's purpose. This one covers a single visual style. The agent builds beams that start from or converge at a corner or edge junction, with a bright emitter point, bloom around that point, and atmospheric glow or fog around the beams.
The skill tells the agent to use your design's main accent color for the halo and haze, while keeping the brightest beam core near white. It also tells the agent to avoid centered or generic laser designs, and to keep motion restrained with slow pulsing, faint traveling energy, or gentle shimmer.
- Two or three thin, sharp beams derived from one off-center corner point
- A hotspot at the emitter that is the brightest point in the composition
- Glow and volumetric haze localized around the corner, not full-screen fog
- Tint taken from your design's accent color instead of a fixed blue
Install the corner-lasers skill
Download the corner-lasers ZIP from this page. Unzip it into your personal skills folder, ~/.claude/skills/, or into a project's .claude/skills/ folder if you want the skill available only for that project.
If you use the Claude apps instead of a local setup, upload the ZIP under Settings → Capabilities → Skills.
- Personal install: unzip into ~/.claude/skills/
- Project install: unzip into .claude/skills/ inside your project
- Claude apps: Settings → Capabilities → Skills, then upload the ZIP
Trigger the skill with a natural request
You do not need special syntax. Describe the look you want and mention the corner or the laser style. The demo prompts in the package reference the skill by name as $corner-lasers, which is a clear way to point the agent at it.
Good requests name the placement, the beam feel and the content the effect sits behind. Mention your accent color if you have one, so the agent does not have to guess.
- Use $corner-lasers to make a hero background with laser beams meeting at the top-left corner, tinted with our teal accent.
- Create a portal-seam background anchored in the bottom-right corner, with a bright emitter and soft haze behind the headline.
- Build a standalone HTML landing page with a corner laser accent that uses our primary color for the glow.
Example: a demo page from the included prompt
The package includes demo/PROMPT.md, which shows a full-page request. It asks for a responsive standalone HTML design that matches a reference demo, with a product brief, content anchors and an interaction finish. Its minimal version is a single sentence that names the skill and asks for a responsive standalone HTML design.
Use the demo as a template for your own brief: state the page concept, the purpose of the visual, and the copy the page must carry, then ask for the corner laser treatment.
Use $corner-lasers to create a responsive standalone HTML design with the same visual confidence, hierarchy, and interaction finish as the included Neuform reference.What the skill needs and how it runs
The skill lists no required tools. It does not run scripts and does not use the network, according to its listing. The effect itself is produced by the agent writing the output, and the skill prefers raw WebGL shader code when the output format supports it.
If your target does not support WebGL, the skill allows equivalent effect logic. Check that your page still works in that case.
- Requirements: none listed
- Scripts: none
- Network access: none
- Preferred technique: raw WebGL shader treatment where supported
Tips for getting a good result
Keep the emitter off-center. The skill says to move the corner point inward from the edge to frame the composition, and it warns against symmetrical centered layouts.
Tune the atmosphere rather than the beams alone. Bloom radius, fog density, falloff and vignette strength control whether the corner stays luminous without washing out your text.
Check contrast on real content. The skill itself warns that glow and motion can distract from or wash out UI text, so test the page with your headlines and buttons on top.
- Ask for two or three beams with clear directional contrast
- Name your accent color so the halo matches your brand
- Ask for restrained motion, not chaotic flicker
- Review the output in a browser before publishing
What people use it for
- A cinematic hero background for a product landing page with a corner emitter behind the headline
- A portal-seam accent on a section divider in a marketing site
- A WebGL or shader-based background prototype for a front-end team
- A corner glow in a brand-accent color that replaces a generic blue laser look
Frequently asked questions
How do I install the corner-lasers skill?
Download the ZIP from this page and unzip it into ~/.claude/skills/ for personal use, or into a project's .claude/skills/ folder. In the Claude apps, you can instead upload the ZIP under Settings → Capabilities → Skills.
Does the corner-lasers skill require anything else to run?
The listing shows no required tools, does not run scripts, and does not use the network. It is a set of instructions the agent follows when it writes the effect.
Is the corner-lasers skill free?
The skill is published under the MIT licence, as stated on this listing. Check the licence file in the source repository for the full terms.
Can I use corner-lasers for a centered laser effect?
No. The skill is scoped to corner-based beam compositions and tells the agent to avoid generic centered lasers, particle scenes and unrelated motion systems.
Why does the glow make my text hard to read?
The skill itself warns that glow and motion can wash out UI text on simple or accessibility-first pages. Reduce bloom and fog, lower the glow intensity, or choose a corner position that keeps the text on a darker area.
Can the effect use my brand color instead of blue?
Yes. The skill says to derive the halo and atmospheric tint from the design's primary or strongest accent color, while keeping the beam core near white. Name your color in the request.
New agent skills, repos and AI tools — every week
The best new skills and open-source projects, the fastest-growing repos, and one free prompt. Five minutes to read. Unsubscribe anytime.
Our verdict
Use corner-lasers if you want a specific cinematic corner beam background tinted to your brand, and you are comfortable reviewing the output for readability. Pick a different tool if you need centered effects, particle systems, or a strictly flat, accessibility-first page with no decorative motion.
Download the skill