Hero Calendar Flip
SkillWeb & browsingLets your agent build an animated HTML desk calendar whose page flips to the next day.
Then ask your AI: use the Hero Calendar Flip skill
Details
Instructions available. Your AI can read the instructions. Execution depends on the setup they require.
Account requirements not reviewed. Check the skill instructions before use; Ahel provides instructions and does not run this skill.
No other account needed.
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 collects 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-calendar-flip/SKILL.md and read by Ahel’s review.
A red-header desk calendar flips its page from 3 to 4. Function: date advance / ship-day marker.
Purpose
- Launch-day and scheduling heroes
- Physical page flip (rotateX from top edge)
- Warm paper on blush background
Specs
- Top page rotates away to reveal the next day
- Soft settle on the calendar block after the flip
- Entry:
index.html
Usage
npx hyperframes preview
ui2v motion publish . --version 1.0.0
Notes
Keep the month label short. Locale-long month names crowd the red header bar.
Signals
- GitHub stars
- 1k
- Forks
- 111
- Last commit
- Oct 2026
Advanced
- Item type
- skill
- Key
hero-calendar-flip- Source
- github.com/unclecheng-li/ai_animation
github.com/unclecheng-li/ai_animation
Related picks
Skill · thedaviddias
The pick for Csscss-grid-math
Skill · hashgraph-online
The pick for Csssvg-optimization
Skill · thedaviddias
The pick for Svgian-xiaohei-svg-motion
Skill · pluviobyte
The pick for Svgbrowser-use
Skill · browser-use
More in Web & browsingwebapp-testing
Skill · anthropics
More in Web & browsing