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/shiomi, working in your browser. Opens in a new tab. Also: Swellhouse.

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

What you get

  • A self-contained index.html hero and an embed.html to paste into an existing site
  • A great wave that rises, curls, grows claws of foam and breaks into spray, with rows of capped waves and a second wave behind
  • A light washi version or a night version, in your own blues, foam, outline, sky and sun colors
  • 20 documented effect settings: seed, cycle, break direction, size, curl, fingers, rows, second wave, spray, stripes, bokashi, sun, sea, shallow, foam, line, sky, sun color, line weight and grain
  • An SVG still of the wave at its height for no canvas, and one real frame for reduced motion, so the hero is never blank
  • Contrast and layout checks at 390, 768, 1024 and 1440 px, with the sea kept out from under the copy
  • A frame-exact MP4 (1080p by default, portrait sizes too) and a poster, the same on any machine
  • Open-source licenses for every part it builds on

Good fit

  • Japanese restaurants, tea houses and food brands can set their headline beside a generated sea in the manner of a woodblock print.
  • Surf schools, coastal shops and ocean brands can use a night indigo version with a coral sun and a fuller curl.
  • Brands that want flat, outlined print art rather than photographic or 3D water get key-block lines, off-register blues and paper grain.

Not for

  • Reproducing a particular historical print: the waves are original line art in that manner
  • Photographic or 3D water: this is flat, printed, outlined
  • Full landing pages below the hero (see the Landing Pages series)

About this skill

A hero section with a sea drawn like a Japanese woodblock print. Rows of small waves cross a washi-paper sea under a graded band of sky and a flat sun, each crest capped with a hooked curl of foam. A great wave rises out of them, curls over into a spiral while claws of foam sprout along its lip, holds with flecks of spray hanging over it, then breaks: the tip comes apart into falling drops and the wave sinks back as a second wave rises behind it. Every shape has a key-block outline, the flat blues sit a hair off register with a faint baren grain, and all of it is generated, not traced. Your agent sets your blues, fonts, logo and words, checks contrast at four widths and records a seamless 12-second 1080p loop.

Example request

Build an Ukiyo Wave hero for Shiomi, a twelve-seat coastal kappo counter: Prussian blue sea on warm washi with a vermilion sun, headline 'Fish from the tide, cooked at the counter.', and record the 12-second loop.

Similar Skills

View all
web
Circuit Trace HeroClaude CodeCodexCursor+3 more agents
web
Confetti Launch 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

Plain 2D canvas (no libraries)Procedural curls: tapered ribbons that turn faster toward the tipMotion Heroes kitHeadless Chrome checks and frame-stepped recorderffmpeg
Good forProduct launchBrandWeb design

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

Write a review

FAQ

Is it a copy of a famous print?

No. Nothing is traced from a print: each curl is a tapered ribbon that turns faster toward its tip, and every claw, cap and line is generated from that. The waves are original line art in the woodblock manner, so it won’t reproduce a particular historical print.

Will the wave cover my headline?

No. The sea is kept out from under the copy: beside it the sea ends in a soft fade, and on phones it fades out above the words, so the text sits on paper or the sky band. The build checks the ink against both. If the curl crowds the copy, lower the size or break it the other way.

Which fonts suit a woodblock look?

Any Google Fonts family works, and the pinned list loads from jsDelivr with integrity hashes. A mincho serif such as Zen Old Mincho or Shippori Mincho suits food and tea, and a tall condensed face such as Anton suits surf. Without a connection the page uses system fonts.

Which agents is Ukiyo Wave 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 woodblock wave effect, its curls, claws, rows and spray, the Motion Heroes kit 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.