Skip to content
Founding Lifetime: every Pro skillfirst 100 members · $199 onceUpgrade
Lookbk
Sign In
Open live demo

The page this skill built from examples/halfsleep, working in your browser. Opens in a new tab. Also: Maison vey.

12-second example rendered by this skill from examples/halfsleep · 1280×720

What you get

  • A self-contained index.html hero and an embed.html to paste into an existing site
  • Your sky, glow, sun and land colors, fonts, logo, headline, buttons and the print's title
  • 19 documented effect settings: seed, loop length, four colors, horizon, sun size, ridges, lake, sort thresholds, amount, sweep side, glitch slices, pixel size, frame, caption, readout
  • Dark or light pages, left, right or centered layouts, a framed print or a full bleed, with the print above the copy on phones
  • An SVG still picture for reduced motion or a failed script, so the hero is never blank
  • Contrast and layout checks at 390, 768, 1024 and 1440 px
  • A frame-perfect MP4 that loops seamlessly (1080p by default, portrait sizes too) and a poster
  • Open-source licenses for every part it builds on

Good fit

  • Record labels, electronic musicians and fashion labels can put a framed glitch print beside the headline that looks broken on purpose.
  • Brands with a deep and a bright color can set the sky, glow, sun and land, and the sort melts them into long streaks.
  • Releases with a catalogue number or print name can show it as the plate’s caption, with a live readout of the sort under the other corner.

Not for

  • Showing your own photo or artwork: the landscape is generated, not uploaded
  • Calm corporate brands: the print is meant to look broken on purpose
  • Full landing pages below the hero (see the Landing Pages series)

About this skill

A framed glitch-art print beside your headline. A dusk landscape (sky, cloud strata, a low sun, hazy ridges, a lake that mirrors them) is painted and genuinely pixel-sorted every frame: a sweep crosses it in vertical bands, the sky and hills melt into long sorted streaks and the sun pulls up into pillars of light, then the scene re-forms, while thin slices slip and split in colour. A small caption reads the sort live. Your agent sets the four landscape colors, fonts, logo, headline and buttons, checks contrast at four widths and records a seamless 1080p loop.

Example request

Build a Pixel Sort Glitch hero for Halfsleep Records, a slow electronic label: near-black page, violet and coral dusk landscape, headline 'Records for the last light.', caption 'HS-031 · Ferry Lights', and record a 12-second loop.

Similar Skills

View all
web
Confetti Launch HeroClaude CodeCodexCursor+3 more agents
web
Firefly Meadow HeroClaude CodeCodexCursor+3 more agents

Details

Output
Animated canvas hero · page + embed + 1080p video
Needs
Node.js 18+, Chrome (or Chromium/Edge), and ffmpeg for the video
Series
Motion Heroes · 50 skills
Updated
Oct 26, 2026
Checked
Oct 26, 2026: its own commands ran and passed. That is a working check, not a security audit.

Generates with

Canvas 2D (hand-written landscape painter and pixel sorter, no libraries)Real per-frame pixel sorting in seeded column bandsMotion Heroes kitHeadless Chrome checks and frame-stepped recorderffmpeg
Good forProduct launchBrandSocial mediaWeb design

Installed it? Tell others how it went. Reviews come from people who installed this skill.

Write a review

FAQ

Can I sort my own photo or album cover?

No. The landscape of sky, cloud strata, sun, ridges and lake is generated from your four colors and a seed, not uploaded. The sorting is real and runs every frame on that painted scene, so you shape it with the seed, horizon, sun size, ridges and lake.

How do I make it gentler or wilder?

Raise low so only the sky and the sun melt, or lower amount, for a gentler print. For a wilder one lower low to 0.1 and raise glitch. Set pixel to 3 or 4 for a chunky printed-pixel look. The build insists the sun is at least 2.5:1 on the sky.

Will it run smoothly on older phones?

Each frame sorts real pixels on a plain 2D canvas. The default pixel size is 2; below 1.5 it is smooth on a laptop but heavier on old phones. Visitors who ask for reduced motion get one still frame at 5.2 seconds.

Which agents is Pixel Sort Glitch Hero written for?

Any agent that reads SKILL.md folders, including Claude Code, Codex, Cursor, GitHub Copilot, Gemini CLI and OpenCode.

Do I own what I make with it?

Yes. Everything your agent makes with this skill is yours, including for client and commercial work.

What if it doesn’t work for me?

Email support@lookbk.dev within 7 days of buying and we’ll fix it or refund you.

Credits and licensesWritten by Lookbk

Lookbk wrote this package: the Motion Heroes kit, the landscape painter and pixel sorter, the still picture and the examples. No third-party code is included. Written by Lookbk, no third-party code.

Credits and licenses for the open-source software and fonts it uses are in NOTICE.md inside the download.