components.work - Next.js Hero 组件库

components.work 是由 Bridger Tower 创建的一个精选 Next.js 组件库，专为构建营销网站和落地页设计。该项目提供了多种精美的 Hero 组件，开发者可以直接复制粘贴到应用中快速使用。

项目简介

components.work 是一个开源的 React/Next.js 组件集合，专注于提供高质量的营销页面组件。所有组件均采用现代技术栈构建，设计简洁优雅，适合快速搭建专业的落地页。

该项目在 GitHub 上开源，源代码可在 brijr/components 获取。

核心特性

• 即用型组件：所有组件均可直接复制粘贴使用
• 多种 Hero 样式：提供 6+ 种不同风格的 Hero 组件
• 现代技术栈：基于 Next.js、React 和 Tailwind CSS
• 响应式设计：所有组件均支持移动端和桌面端
• 暗色模式支持：内置主题切换功能
• TypeScript 支持：完整的类型定义

可用组件

Hero One

简洁的单栏布局，包含标题、描述和邮件订阅表单。

Hero Two

带有公司 Logo 展示的双栏布局，适合展示品牌合作。

Hero Three

特殊图片展示能力的组件，支持多图展示和标签。

Hero Four

导航式 Hero 组件，包含顶部导航和多个行动按钮。

Hero Five

全宽图片展示 Hero，视觉冲击力强。

Hero Six

带有双按钮的 Hero 组件，适合多种行动号召场景。

使用方法

1. 访问 components.work/hero
2. 浏览并选择喜欢的组件
3. 点击 "Copy Code" 按钮复制代码
4. 粘贴到你的 Next.js 项目中

技术栈

• 框架：Next.js 14+
• 语言：TypeScript
• 样式：Tailwind CSS
• 组件库：Shadcn/ui
• 图标：Lucide React

项目链接

• 在线预览：components.work
• GitHub 仓库：github.com/brijr/components
• 作者 Twitter：@bridgertower

总结

components.work 是一个实用的 Next.js 组件库，特别适合需要快速构建营销页面的开发者。其简洁的设计和便捷的复制粘贴使用方式，大大提高了开发效率。如果你正在寻找高质量的 Hero 组件，这个项目值得一试。