Flip Words Hero — mcpskills.net

Create a hero headline with a flip-word animation. The sentence should be static except for one word that rotates vertically in 3D, cycling through 3-4 alternatives (e.g., "Build fast. Build bold. Build beautiful."). Use a dark background, a large bold sans-serif font in white, and a highlighted color for the flipping word. The flip animation should feel smooth and use perspective/rotateX transforms. Use Tailwind CSS and CSS keyframes. No decorative images.

创建一个带翻转词动画的 hero 标题。句子其余部分保持静态，只有一个词垂直 3D 旋转，循环 3-4 个替代词（例如 "Build fast. Build bold. Build beautiful."）。使用深色背景、白色大号粗体无衬线字体，翻转词使用高亮色。翻转动画应流畅，使用 perspective/rotateX 变换。使用 Tailwind CSS 和 CSS keyframes。无装饰图片。

## Overview A kinetic headline that keeps the page alive by flipping a single descriptive word. Great for conveying multiple value propositions in one line. ## Features - Static sentence with one animated word - Vertical 3D flip rotation - 3-4 cycling word alternatives - Dark background + bold white typography - Highlighted flipping word - Perspective/rotateX transforms ## Usage Use for SaaS heroes, agency taglines, or product pages where a single adjective isn't enough. ## Customization Modify the prompt to: - Add a blur fade during the flip - Use a serif italic font for the flipping word - Add a typing cursor after the final word - Make the flip trigger on scroll into view