Typewriter Hero

Create a minimal hero section with a typewriter effect. The headline should type out character-by-character on load, followed by a blinking cursor. Use a monospace or bold sans-serif font in white on a dark background. Add a short static subheadline below and a simple outline CTA. Use JavaScript to control the typing timing and Tailwind CSS for styling. Keep it clean and cinematic.

创建一个带打字机效果的极简 hero 区域。标题应在加载时逐字打出，后面跟随闪烁光标。使用深色背景上的等宽或粗体无衬线白色字体。下方添加简短静态副标题和简单轮廓 CTA。使用 JavaScript 控制打字时间，Tailwind CSS 设置样式。保持干净和电影感。

Overview

A quiet, cinematic hero that uses typing motion to build anticipation. Great for developer tools, security products, or AI interfaces.

Features

• Character-by-character typing
• Blinking cursor after text
• Monospace/bold sans-serif
• Dark background
• Static subheadline + outline CTA
• JavaScript-driven timing

Usage

Use for hero sections where the message should feel deliberate and precise.

Customization

Modify the prompt to:

• Type multiple lines in sequence
• Add a backspace/rewrite loop
• Change cursor color to accent
• Add sound feedback (optional)