35+ 个免费 React 模板和主题
在互联网上搜索模板和主题时,很难找到免费的 React 资源。
即使你不注重质量,它们似乎也很难被发现。出于好奇,我花了几个小时在 Google 和 Github 上搜索,最终找到了这个包含 35 多个免费 React 模板和主题的精美合集。虽然我不敢保证,但它们确实是高质量的资源。
所以,在这个列表中,你可以找到各种各样的模板和主题,几乎可以构建任何你能想到的东西。例如:
- 管理仪表板
- 网站
- 登陆页面
- 在线投资组合
- 博客
- 设计系统
我没有将资源分成几部分(例如网站模板),因为此列表中的并非所有内容都属于特定类别(例如组件库、UI 工具包等),所以我建议您浏览整篇文章并为您最喜欢的内容添加书签。
最后一点:尽管我们不能将组件库和 UI 工具包视为模板和主题,但它们是启动新项目的绝佳起点,因此我认为值得在此集合中提及其中的一些。
1.打开
Open 是一款免费的 React 模板,专为希望为其开源项目、在线服务、数字产品等创建快速专业的落地页的开发者打造。Open 旨在吸引潜在客户和电子邮件订阅者,提供了一个功能多样、简洁、可重复使用的组件和元素库。
特征:
- 专为开源产品和在线服务而设计
- 深色简约设计
- 可通过 Github 下载
2.雾化
Atomize 是一个 React UI 框架,旨在帮助开发人员与设计师协作,轻松构建一致、和谐的用户界面。得益于样式指南和灵活网格等资源的完美结合,Atomize 适合创建任何类型的响应式网站。
特征:
- 优雅而美丽的 React 组件
- 网站和响应式应用程序的设计系统
- 完全控制创建响应式应用程序。
3. Treact
Treact 是一个免费且现代化的 React 模板和 UI 组件库,使用 TailwindCSS 作为前端框架开发。这个精美的资源库提供了 7 个预建主页、8 个辅助页面以及 52 个预先设计的元素和版块。每一项内容均可完全自定义,并可扩展至桌面、平板电脑和移动设备。
特征:
- 丰富的模板和块库
- 一致的图像和插图
- 现代而多功能的外观和感觉
4. MatX
MatX 是一款基于 Material Design 精心打造的 React Native 模板。这款管理仪表板模板使用 React、Redux 和 Material UI 构建,涵盖了您为 Web 应用打造全新家园所需的所有基本功能。MatX 的免费版本可用于轻松设置管理面板、用户管理系统和项目管理系统。
特征:
- Material UI 组件和元素
- 仪表板和分析视图
- 美丽的调色板组合
5.霍莉
Holly 是一款响应式 React JS 模板,适用于希望在主产品开发期间开始积累电子邮件地址的在线服务和数字产品开发者。这款紧凑型模板最初由Cruip使用 HTML 设计,之后使用 React 编写了此版本。
特征:
- 预先设计的形状和元素
- 超级容易设置和启动
- 时尚且适应性强的外观,满足不同的产品需求
6. OAH-管理员
OAH-Admin 是一个免费的 React 管理仪表板模板,基于 Gatsby 开发,并包含 oah-ui 组件和元素包。该 React 模板包含大量精心设计的 UI 组件,其简洁灵活的布局使任何人都可以轻松创建任何类型的基于 SaaS 的 Web 应用程序、管理面板、仪表板等。
特征:
- 精美构建的深色布局
- 一些额外的组件和动作
- 可扩展且优雅的应用程序界面
7. Gatsby Starter Ghost
使用 Ghost 基于 Gatsby 开发的这款入门模板,轻松创建响应式、极速的网站。Gatsby Starter Ghost 是一款简洁现代的博客、杂志或任何新闻网站模板。该产品专为帮助任何人在互联网上创建个人空间并分享想法、创意和动态而设计。
特征:
- 全宽英雄添加图像或视频
- 预填充内容
- 可按作者或标签对帖子进行排序
8.明星管理员
一个免费的 React Native 模板,提供丰富多样的基本元素,助您实现任何创意。该模板拥有精心设计的仪表板,其中包含大量排列整齐、井然有序的功能模块,可与所有最新、最流行的 Web 浏览器完美兼容,并能使数据可视化过程更易于管理。
特征:
- 跨浏览器兼容性
- 材料设计图标
- 简单而灵活的 JavaScript 图表
9. Carolina 管理仪表板
如果您正在寻找一款美观且功能强大的 React 仪表板模板,Carolina Admin Dashboard 可以满足您启动和运行 Web 项目的所有需求。这款精美的模板基于 Material-UI 框架构建,设计简洁清新,遵循 Google 的所有 Material Design 指南。此外,其核心结构完全响应式且开源。
特征:
- 23个主页和内页
- 包含实用工具和助手
- 完全可滚动的布局
10. Tabler
Tabler 是一款免费的 React 管理仪表板模板,适用于任何类型的后端 Web 应用程序。该管理模板包含大量精心设计的演示,无需从头开始,从而节省大量时间。此外,它还附带可重复使用的组件,例如按钮、地图、图表、表单等等。
特征:
- 灵活的图表和数据元素
- 无限的后端可能性
- 预构建且响应迅速的小部件
11. React Nice 简历
React Nice Resume 是一款精美的主题,适合开发者、设计师或数字创作者用来推广自己和作品。该主题包含一个独特的固定英雄版块,其中包含粒子背景、工作经历时间轴、技能图表、用于显示最新项目的缩略图以及一个带有功能性输入表单的咨询版块。
特征:
- 粒子组件库
- 关于我和联系方式
- 顶部标题可平滑滚动至各个部分
12. Boss Lite
Boss Lite 是一款基于 React 和 Redux 的精美管理仪表板模板。该模板为您带来清新现代的设计,包含高性能应用程序和多种配色方案。它旨在使任何类型的 Web 项目都能轻松上手开发,并且得益于现代化的工作流程和 Flexbox 的灵活布局,开发过程更加流畅。
特征:
- SSR 带来高性能
- 可重复使用的组件和模块
- 易于管理和维护
13. Chakra UI
Chakra UI 提供了一组易于访问且可复用的 React 函数式组件,让您能够轻松创建易于访问的网站和用户界面。Chakra UI 中几乎所有元素都兼容暗黑模式,遵循 WAI-ARIA 指南规范,并基于 React UI Primitive 构建,以实现无限的可组合性。
特征:
- 数百名贡献者
- 完整的格式脚本
- 通过传递 props 轻松进行造型
14.黑色仪表板反应
Black Dashboard React 是一款适用于管理界面的生产级 React 应用模板。该模板基于 Bootstrap 创建的设计指南构建,是企业级应用程序和强大后端软件的绝佳前端选择。它引入了更高级别的细分、设计工具包和可重复使用的图表,以从始至终改善用户和开发体验。
特征:
- 精心编写的文档
- 移动设备支持
- 不同菜单的动态权限
15.氩设计系统
使用适用于 Bootstrap 4 和 Reactstrap 的 React 设计系统开启您的下一个网页设计项目。Argon 设计系统包含超过 100 个独立组件和预置示例,每个元素都拥有多种样式、悬停和焦点状态,任何人都可以轻松访问和使用。该产品是从原型设计到完整功能代码的完美解决方案,因为所有内容都已实现。
特征:
- 预建页面变体
- 现代用户界面
- 轻松更改文本和图像
16. Devias Kit - 管理面板
Devias Kit 是一款响应式 Material Design 管理面板,专为 React 打造,使用 Google 自带的 Material Design 框架,可自定义设置、指令、图标和样式等。该模板包含清晰直观的目录和文件、快速入门文档,甚至还提供 Sketch 文件,方便您快速更改设计。
特征:
- 多个单页
- 风格指南和排版尺度
- 完整的用户流程
17.开发者博客
Dev Blog 是一款 React 网站模板,专为希望快速搭建专业博客的开发者打造,用于搭建自己的业余项目和产品。这款网站模板的首页会显示博客名称、社交媒体图标以及包含文本和图片的文章缩略图。此外,该模板还包含一个单篇文章页面,并采用精心设计的精美排版。
特征:
- 专业和个人博客模板
- 修复静态图像
- 该博客完全静态生成
18.Material PRO
Material Pro 是一款免费的 React Native 模板,专为所有想要创建管理仪表板的用户精心打造。这款美观简洁的产品采用模块化和现代设计理念开发,100% 免费使用和下载,并包含大量页面,可帮助您更快速、更轻松地创建项目。
特征:
- 即用型小部件
- 集成插件
- 暗色侧边栏版本
19. Ant Design 落地页
Landing 是由 Ant Design System 构建的模板。它功能丰富,包含丰富的首页和内页模块,您可以快速配置并启动项目,此外还有一个灵活且强大的在线编辑器,您可以用它来创建无限数量的专用页面,并与网站的其他部分保持一致。
特征:
- 包含 Sketch 文件
- 丰富的模板种类
- 综合风格指南
20.同构
Isomorphic 是一个易于管理且美观的管理模板,拥有大量灵活的组件,每个组件都经过精心设计,并可组合成美观的 Web 应用程序。使用 Isomorphic,您可以配置不同的导航位置、大小和调色板方案,以快速适应任何类型的现有管理项目。
特征:
- 自定义表单和分页
- 可读的安装指南
- 不同的包目录
21. Shards 仪表板精简版
Shards 是一款免费的 React 仪表板模板,采用现代设计系统,包含大量自定义页面和版块。该模板遵循现代开发最佳实践,完全响应式设计,能够适应和重排任何视口大小,并支持多种第三方插件,例如 React Table、React Date Picker 等。
特征:
- 1500+ 支持图标
- 轻量级且性能优化
- 卓越的代码质量
22.uiw
uiw 是一个适用于 React 16+ 的高质量 React 组件库和 UI 工具包。这个强大的资源遵循最新的设计趋势和最佳实践构建,并附带大量预先构建和设计的组件,例如表单、按钮、分隔符、日期选择器、切换器、时间选择器、调色板、图标等等。
特征:
- 根据 MIT 许可证发布
- 编译后的组件代码
- 反应覆盖触发器
23. React Material 管理员
React Material Admin 是一款基于 Material-UI 框架构建的 React 仪表板,并且完全免费使用 jQuery 和 Bootstrap。这款 React 模板是构建 SaaS 应用程序、电商平台、物联网仪表板或任何您能想到的 Web 产品前端解决方案的绝佳起点。该模板会持续更新,添加新的精华内容和功能。
特征:
- 通过票务系统提供全面支持
- 包含基本仪表板
- 丰富的通知栏
24.Material KIT React
Material UI KIT 是一款免费的 React UI 主题,其设计灵感源自 Google 的 Material Design,清新简洁。除了重新设计了 Material-UI 元素外,这款强大的资源还包含三个完整编码的示例页面,例如:落地页(用于展示数字产品和应用)、作品集页面(用于展示过往作品)以及登录页(任何 Web 应用的入口)。
特征:
- 60+ 预建元素
- 3 示例页面
- 完整编码和记录
25.机身
Airframe 是一款基于 Bootstrap 4 和 React 16 的免费开源 React 应用模板。凭借其极简主义的设计和创新的 Light UI,该模板将帮助您构建一个拥有出色用户界面、令人惊艳且引人入胜的响应式应用程序。Airframe 专为大规模应用而设计,并支持分步文档。
特征:
- 10+ 种布局变化
- 120多个独特页面
- 完全适应响应式设计
26.盖茨比简易作品集
Gatsby Simplefolio 是一款简洁、美观且响应迅速的 React 作品集模板,适合开发者、工程师和程序员。其布局非常直观,模板附带的说明可帮助您在本地计算机上创建并运行项目副本,用于开发和测试。如果您想在实际系统中部署项目,还可以查看相关说明。
特征:
- 现代揭示动画
- 采用 Bootstrap v4.3 样式
- 使用 Gatsby 进行图像优化
27. Ant Design Pro
您是否需要一个适用于企业应用程序的开箱即用的 UI 解决方案作为 React 样板?Ant Design Pro 是一款精心打造的 React Native 主题,它为开发人员和初创公司提供了丰富的现成仪表板页面、身份验证、预建表单和 UI 列表,以便快速绘制和部署外观精美、运行更顺畅的应用程序布局。
特征:
- 针对不同屏幕尺寸设计
- 可定制主题,配置简单
- 采用最新的开发堆栈构建
28. React SaaS模板
React SaaS 是一款轻量级且新颖的模板,专为希望为其 SaaS 项目、在线服务和数字产品提供简洁明了页面的初创公司开发。React SaaS 模板包含一个包含应用功能的主页、一个博客部分以及一个用于引导新用户的模态注册表单。
特征:
- 基于视口的动画
- 表情符号选择器
- 顶部的加载栏
29.碎片反应
Shards React 是一款免费的 React UI 工具包,拥有现代设计风格和数十个自定义组件。这个大型库专为产品级应用和工具打造,包含全面且精心编写的指南、移动端 UI 元素、现成的配色方案以及新一代图形化工作解决方案。
特征:
- 高质量的产品原型
- 草图设计文件
- 强大的高级图标集
30.基础网络
Base Web 是一个 React 组件库,用于创建、开发和统一 Web 产品。这款庞大的产品提供了一套强大的开箱即用组件,例如日期选择器和低级可组合原语等即用型功能元素。Base 是一个由现代、响应式、动态组件组成的设计系统。
特征:
- 极高的定制水平
- 样式和有序的组件
- 内置辅助功能
31.浅蓝色 React 仪表板
Light Blue React 是一款免费的深色管理模板,基于 React 和 Bootstrap 4 构建。在设计方面,该模板展示了几个数据相关和分析的小部件、一个地理位置地图、一个功能齐全的侧边栏,以及一个包含多个行动号召和搜索输入表单的标题。此外,该模板还提供了 UI 列表和功能齐全的图表。
特征:
- 漂亮的深色布局
- 传统媒体和社交媒体登录
- 交互式地图、图表和小部件
32. React JS 登陆
React JS Landing 是一个简单的 React 应用模板,适用于初创公司、数字代理机构和产品相关品牌。这个单页模板通过视差滚动效果提供了不同的可滚动部分,一个用于展示产品功能或优势的缩略图库,几个现成的图标,一个与团队见面的组件,以及一个用于显示图像或视频的全宽英雄页面。
特征:
- 有吸引力的视差滚动效果
- 引人注目的图像和图像
- 使用文本字段进行联系部分
33.管理员专业版
这款 React Native 主题基于一些有趣的技术精心打造,涵盖了开发强大而复杂的 Web 应用程序、SaaS 后端界面和软件所需的一切。模板包含各种必要的组件,可让您轻松完成开发和定制。
特征:
- 15+ 个页面和组件
- 终身免费更新
- 多种图表选项
34.蓝图
Blueprint 是一个用于 Web 的 React UI 主题和工具包。该主题经过全面优化,可用于构建复杂、数据密集的 Web 界面,适用于可在多种浏览器(包括 IE11)上运行的桌面应用程序。与其他非常相似的资源不同,Blueprint 并不支持移动优先的理念。
特征:
- 可扩展的交互式表格内容
- 与日期和时间交互的元素
- 选择时区的组件
35.达塔
Datta 是市面上最引人入胜的 React 免费模板之一,相比市面上其他所有管理资源,它拥有丰富的以内容为中心的页面,代码完全开发者友好,并且在最终发布之前经过了各种流程和测试,使其性能和设计美感达到前所未有的最佳水平。
特征:
- 实时页面定制器
- 即用型仪表板小部件
- 更快的加载速度
36. Flatlogic One
Flatlogic One 是一款全新的资源,采用 React 和 Bootstrap 前端框架制作而成。该模板非常适合创建金融科技、数据表和基于 Web 的应用程序。Flatlogic 提供可重复使用的 React 钩子,用于创建响应式 Web 活动,主导航位于左侧边栏,因此内容始终居中对齐,符合最佳标准。
特征:
- 集成功能图
- 深厚而丰富的背景
- 面向开发人员的产品
结论
希望这套免费的 React 模板和主题能够帮助您在开发个人和商业项目时节省一些时间。欢迎在下方回复分享更多相关资源。
文章来源:https://dev.to/davidepacilio/35-free-react-templates-and-themes-32ci