Hero Price Tag

SkillWeb & browsing

Lets your agent add an animated swinging price tag to a web page to show off a discount.

Then ask your AI: use the Hero Price Tag skill

Details

Instructions available. Your AI can read the instructions. Execution depends on the setup they require.

Add it as a step in a pipeline you build on Ahel, or connect Ahel to Claude, ChatGPT, Cursor, Claude Code or Codex and ask your AI to use it.

About this skill

This project compiles AI Prompts for generating [cool HTML animated web pages], covering categories such as animation effects, 3D visualization, PPT-style presentations, and UI beautification.

What this skill tells your AI

The instructions your AI receives, as published by unclecheng-li/ai_animation in skills/ui2v-motions/01_动效库/itelmn/hero-price-tag/SKILL.md and read by Ahel’s review.

A hanging orange price tag drops on a string and swings to rest on a discounted figure. Function: commerce / offer reveal.

Purpose

  • Pricing and launch-offer heroes
  • Physical pendulum settle (rotate around hang point)
  • Warm paper store aesthetic

Specs

  • Tag transformOrigin is left-center near the eyelet
  • String draws first, then the tag swings
  • Entry: index.html

Usage

npx hyperframes preview
ui2v motion publish . --version 1.0.0

Notes

Keep the struck-through price readable. Tiny original prices disappear at thumbnail size.

Signals

GitHub stars
1k
Forks
111
Last commit
Oct 2026
Advanced
Item type
skill
Key
hero-price-tag
Source
github.com/unclecheng-li/ai_animation