MOT-006
Checklist filling in
- Four to-do lines are ticked one by one from the top.
Make an animation where the checklist [list of items] is ticked one by one from the top. Each box fills with [check colour] as a tick is drawn, and a line strikes through the text. 0.6 seconds between items; when done, clear them all and start again.
Put CSS and JavaScript in a single HTML file. Don't use external libraries or images, and draw in a 16:9 area in the centre of the screen. If prefers-reduced-motion is on, show the final scene without motion.체크리스트 [항목 목록]이 위에서부터 하나씩 체크되는 애니메이션을 만들어 주세요. 네모 칸이 [체크 색]으로 차면서 체크 표시가 그려지고, 글자에는 가운데 줄이 지나가요. 항목 사이 간격은 0.6초, 다 끝나면 모두 비우고 다시 해요.
HTML 파일 하나에 CSS와 JavaScript를 넣어 주세요. 외부 라이브러리와 이미지는 쓰지 말고, 화면 가운데 16:9 영역에 그려 주세요. prefers-reduced-motion이 켜져 있으면 움직임 없이 마지막 장면을 보여 주세요.Blanks
How to use
- Borrow (copy) the prompt.
- Replace the [brackets] with your own content. Type in the fields below and it updates at once.
- Paste it into a new Claude chat and open the HTML file it returns in a browser.
Process
- A scene from the guide "Motion graphics with Claude".
- The preview is drawn on this site to show the scene this prompt makes.







