邮箱订阅

订阅即可免费获取优质的设计资讯!

邮箱订阅

感谢你的支持!

分享到微信朋友圈:

Close

打开微信,点击底部的“发现”,使用 “扫一扫” 即可将网页分享到我的朋友圈。

Mockplus是什么?

更快更简单的原型设计工具,微软、联合国国贸中心、华为、百度、东软、育碧、中石油、Oracle、西门子、IBM都在用,你呢?

开始使用

2019,都在用 iDoc了!

更高效的协作设计工具,产品团队必备。智能标注、一键切图、多样批注、交互原型、全貌画板、团队管理。

免费使用

【友情推荐】人人秀,H5活动制作工具,3分钟完成制作。

了解更多

2019年不容错过!史上最全的Dashboard模板和资源下载

Trista 2019-05-05 14:53:43 阅读:26550

精心设计的Dashboard(仪表板)可以高效展示信息,更能让用户第一眼就迅速捕获到关键信息。同时,Dashboard也是帮助用户在网站或APP上快速导航的最简单方法之一。Dashboard是否可以很好地发挥应有的价值,其设计至关重要。


为了帮助UX/UI设计师更高效地设计出美观又功能强大的Dashboard,Mockplus为你精心挑选了50个免费好用的Dashboard模板和UI工具包,包含Bootstrap 4 Admin Dashboard模板、Dashboardui kit 3.0免费下载资源、BootstrapAdmin模板等等。


全文主要有两部分:


  • 30个最佳Dashboard模板
  • 20个最好的Dashboard UI工具包


第一部分:30个最佳Dashboard模板

1. Argon Dashboard Laravel

Argon Dashboard Laravel是一款为Laravel Framework 5.5以及其更高版本构建的Bootstrap 4 Admin Dashboard。该模板免费,并且为使用者提供了一个完全编码的“前端+后端”解决方案。


特征:

  • 100个手工制作的组件
  • 3个自定义插件


argon-dashboar-laravel


免费下载


2. Black Dashboard


Black Dashboard是一个免费的bootstrap 4 Admin模板,这是一个可用于Admin和可视化业务数据的绝佳模板。其配备了大量的组件、颜色选项、卡片、排版和图形等。


特征:

  • 16个手工制作的组件
  • 3个自定义插件
  • 7个示例页面


black-dashboard


免费下载


3. Now UI Dashboard Angular

Now UI Dashboard Angular是一款免费的Bootstrap 4 Admin Angular 7模板,由原型工具Invision和Creative Tim免费提供。


特征:

  • 16个手工制作的组件
  • 5个自定义插件
  • 7个示例页面


now-ui-dashboard-angular


免费下载


4. Argon Dashboard

Argon Dashboard是一个用于Bootstrap 4的免费开源Dashboard。所有组件都经过完全编码,可帮助你创建出色的网站。


特征:

  • 100个手工制作的组件
  • 4个自定义插件
  • 6个示例页面


argon-dashboard


免费下载


5. Material Dashboard Dark Edition

Material Dashboard Dark Edition是一款免费的Material Bootstrap 4 Admin模板,采用全新设计,灵感来自Google的Material Design。


特征:

  • 60个手工制作的组件
  • 2个自定义插件
  • 3个示例页面


material-dashboard-dark


免费下载


6. Football Dashboard Game

Football Dashboard Game模板具有黑色界面,所有屏幕和元素都是完全可定制的,且组织良好,该模板适用于Sketch Figma,Adobe Xd和Photoshop。


特征:

  • 100%矢量形状
  • 专为Sketch / Photoshop / Figma / XD设计


football-dashboard-game


免费下载


7. Metronic

Metronic是一款响应式的Admin Dashboard模板。该模板完全编码,并且适合所有级别的开发人员。


特征:

  • 全新设计
  • 强大的框架设计
  • 多个演示文件
  • 无限组件数量
  • 深度定制Bootstrap,具有原生外观


metronic-responsive-admin-dashboard-template


免费下载


8. Vuesax Vuejs

Vuesax Vuejs是一款2019年新发布的模板,该模板高度可定制。该模板没有使用jQuery,完全由Vue JS创建,对于开发人员来说,是非常友好的。


特征:

  • 使用Vue CLI创建
  • 浅色,半暗和深色布局


Vuesax-vuejs-admin-dashboard-template


免费下载


9. Decima

Decima是一款使用Angular构建的创意Bootstrap 4 Admin模板。该模板适用于移动端、平板电脑以及桌面运用。


特征:

  • 完全响应式设计
  • 易于定制
  • 语言翻译功能


Decima


免费下载


10. Elite Able - Bootstrap 4Admin模板


Elite Able可以说是一款最全面的Bootstrap 4 Admin模板。它具有功能强大的页面和组件。该模板是Themeforest上评价最高的一款模板。


特征:

  • 超过20种布局,引入14种全新的布局
  • 响应式和移动优先设计
  • 专业的外观设计和色彩组合


Elite Able - Bootstrap 4Admin模板


免费下载


11. Dataviz UI Bootstrap Admin Dashboard模板

Dataviz是一款非常美观的模板,使用CSS,HTML5,jQuery,SASS和Bootstrap框架构建。


特征:

  • 提供Light&Dark两种版本
  • 水平和垂直布局
  • 响应式设计
  • 跨浏览器兼容性


Datavizui-bootstrap-admin-dashboard-template


免费下载


12. RippleUI

RippleUI是一款基于Bootstrap 4构建的模板,有非常好用的组件和插件,并且都是高度可定制的,该模板还使用了Gulp构建,可实现超高速自动化工作流程。


特征:

  • 构建最新版本的Bootstrap(v4.3.1)
  • 完全响应式设计
  • 轻量级代码,可在所有设备上加载
  • 干净直观的设计


Rippleui-bootstrap-4-responsive-admin-dashboard-template


免费下载


13. Free Excel Dashboard模板

基于Dashboard的报告是实现业务目标的强大工具,它可以以单页面布局的形式来展示公司的重要数据。该模板资源包含多个电子表格。该模板资源包含:KPI Dashboard模板、销售Admin Dashboard模板、项目Admin Dashboard模板等。


特征:

  • 6种不同类型的Excel Dashboard
  • 包括Excel 2007和Excel 2010


Free-excel-dashboard-templates


免费下载


14. Atmos

Atmos是新一代的Bootstrap 4 Dashboard模板。它配备了简洁的用户界面,具有可定制的组件和小部件。


特征:

  • 完全响应式设计
  • 两个独立的配色方案
  • 使用Bootstrap v4.2.1创建


Atlas-admin-next-generation-admin-panel-design


免费下载


15. Material Dashboard Pro Angular

Material Dashboard PRO Angular 7是Material Bootstrap 4 Admin模板的高阶版,因此该模板是收费的。该模板采用了全新设计,灵感来自Google的Material Design。


特征:

  • 200个手工制作的组件
  • 15个自定义插件
  • 27个示例页面
  • 基于Bootstrap构建


Material-dashboard-pro


免费下载


16. Ample Admin

Ample Admin是一款很受欢迎的开源WebApp模板,可用于Admin Dashboard和控制面板设计。它是一款响应式HTML模板,基于CSS框架,还包括bootstrap 4版本。


特征:

  • 3个不同的Dashboard
  • 7个不同的演示文件


Admin Dashboard


免费下载


17. Monster Admin

Monstrous Admin是完全响应的HTML模板,基于CSS框架。该模板的设计中使用了所有Bootstrap组件,并重新设计了许多常用插件。该模板具有一致的设计,可用作后端应用程序的用户界面。


特征:

  • 5个不同的Dashboard
  • 6个不同的演示文件
  • 数据表导出格式包含CSV,Excel,PDF,并且可复制和打印
  • 包含PSD文件


Monster-admin


免费下载


18. BangoDash

Bangodash是一款完全响应的bootstrap 4 Admin Dashboard模板。它使用bootstrap 4框架,HTML5,CSS和JQuery构建,适用于所有主要的Web浏览器、桌面和智能手机设备。该模板有大量的UI组件,并且包含最新的jQuery和Bootstrap插件。


特征:

  • 3种不同颜色的Dashboard
  • 70多个响应式HTML页面
  • 易于定制
  • 200多个UI图标
  • W3C验证码


bootstrap 4 Admin Dashboard-bangodash


免费下载


19. Webadmin

WebAdmin是一款基于引导程序的完全响应式Admin模板。它具有许多可重用的UI元素和小部件。


特征:

  • 响应式布局
  • 基于Bootstrap 3.3.7创建


Webadmin-responsive-admin


免费下载


20. AdminLTE Control Panel Template

AdminLTE Control Panel Template是一款最佳开源Admin Dashboard和控制面板模板。它构建于Bootstrap 3之上,完全响应式设计,具有可重用的组件。


特征:

  • W3C服务验证
  • 响应式设计
  • 移动优先设计
  • 1000多个图标


AdminLTE Control Panel Template


免费下载


更多Dashboard模板资源

21. Free Dashboard Presentation Template

可以用于商务会议的Dashboard演示模板。


Free Dashboard Presentation Template


免费下载


22. Argon Dashboard Nodejs

使用Node.js框架构建的Bootstrap 4 Admin Dashboard模板。


argon-dashboard-nodejs


免费下载


23. Vuetify Material Dasboard

建立在Vuetify,Vuex和Vuejs之上的Dashboard模板。


Vuetify Material Dasboard


免费下载


24. Black Dashboard React

界面非常美观的Bootstrap 4(Reactstrap)Admin Dashboard模板。


Black Dashboard React


免费下载


25. Paper Dashboard 2 PRO

Paper Dashboard 2 PRO是一款功能强大的Bootstrap 4 Admin Dashboard模板。


Paper Dashboard 2 PRO


免费下载


26. INSPINIA

INSPINIA Admin Theme是一款具有平面设计理念的高级Admin Dashboard模板。


INSPINIA Admin dashboard


免费下载


27. Minton

Minton是一个功能齐全的自定义Admin主题,使用Bootstrap 4.1.3,HTML5,CSS3和jQuery构建。


Minton-admin-dashboard-landing


免费下载


28. Xtreme

AdminX是一款基于现代和流行设计的模板。


Xtreme-bootstrap-4-dashboard-template


免费下载


29. Root

基于Core UI Pro的Admin的模板。


Root admin dashboard


免费下载


30. Gradient Able

使用最新的Bootstrap 4 Beta框架制作的模板,具有丰富强大的Admin模板功能。


gradient able admin dashboard


免费下载


20款Dashboard UI工具包资源

31. Fobia - Bootstrap 4 Web应用程序UI工具包

Fobia是Bootstrap 4 Web应用程序UI工具包,同时也是一款Bootstrap 4 Admin Dashboard模板,一共包含三种不同类型的Dashboards:渐变颜色Dashboard,纯色Dashboard和深色Dashboard。该工具包完全响应式设计,适用于所有智能设备。


特征:

  • 70多个响应式HTML页面
  • 易于定制
  • 200多个UI图标


Fobia - Bootstrap 4 Web ui kit


免费下载


32. Arion

Arion是适用于Sketch的Admin Dashboard模板和UI工具包。具有浅色和深色两个版本,具有先进的设计系统。该工具包里的每个Sketch文件都经过精心标记,包含组和层的层次结构概述,使用起来也很方便,只需点击即可轻松替换图像,更改颜色和图标等。


特征:

  • 紧跟趋势设计
  • 具有设计系统
  • 具有浅色和深色版本


Arion-admin-dashboard-ui-kit-sketch-template


免费下载


33. Appwork

Appwork是一个Bootstrap 4模板和UI工具包,它基于Bootstrap 4框架构建,具有很好的响应式设计,是可自定义的应用程序和Dashboard模板。


特征:

  • 具有主题皮肤
  • RTL方向支持
  • 具有9种布局
  • 响应式设计


Appwork-bootstrap-4-ui-kit


免费下载


34. Coda

Coda是一款超灵活、超强大的响应式Angular 7+ Admin Dashboard和Sketch UI工具包。Coda采用模块化设计,可轻松定制,适用于所有类型的Web应用程序,你可以自定义Admin面板、项目Admin系统、Admin Dashboard、应用程序后端、CMS或CRM。


特征:

  • 20+独特的角度组件
  • 2100+字体图标
  • 其他页面(404,登录,注册...)


Coda-angular-7-admin-ui-kit


免费下载


35. Fiori

Fiori是一款现代风格的响应式jQuery HTML Bootstrap 4 Admin UI Dashboar工具包。Fiori专为现代应用程序而构建,包含许多组件,元素和小部件。使用该工具包,设计师不用浪费时间去考虑视觉设计。


特征:

  • 10个不同的Dashboard示例
  • 具有邮箱,聊天,常见问题解答部分
  • 超过25种按钮,每种按钮有8种配色方案



Fiori-bootstrap-4-admin-theme-pro


免费下载


36. Flacto

Flacto是一个基于bootstrap 4的高级Admin工具包,它具有超级简洁的用户界面设计,还包含可自定义的组件和小部件以及两种不同的配色方案。该资源完全响应,易于定制,代码也非常易于理解。


特征:

  • 具有Checkboxs
  • 精美图标


Flacto-flat-admin-dashboard



免费下载


37. Dashboard UI Kit Sample Sketch Resource

这是一款适用于Sketch的全新Dashboard UI Kit,设计师是Pierluigi Giglio。


特征:

  • 现代设计
  • 具有内置定制器


dashboard-ui-kit-vol-3-sample


免费下载


38. Dashboard UI Kit Sketch Resource

这是另一款适用于Sketch的Dashboard UI工具包,包含了一些最新的设计趋势和可扩展的组件,如表单,模态弹出窗口,面包屑,图形等等。并且,所有元素都可完全自定义。设计师是Kumar。


特征:

  • 响应式设计
  • 精美组件


Dashboard-ui-kit-uxlead


免费下载


39. DASHBOARD UI KIT

该工具包专注于Dashboard用户界面和Web应用程序的设计,可以帮助你快速进行原型设计。


特征:

  • 76个完整的屏幕
  • 76个像素完美Dashboard设计
  • 免费谷歌字体源Sans Pro和辅助Proxima Nova


Dashboard-ui-kit


免费下载


40. B2C Dashboard UI Kit Sketch

B2C Dash board UI工具包是Sketchapp上一个很优质的资源,由设计师Pierluigi Giglio设计和发布。


特征:

  • 免费的PSD文件
  • Sketch应用资源


B2C Dashboard UI Kit Sketch


免费下载


更多Dashboard UI工具包资源

41. Free Adobe XD Dashboard UI工具包

这是由Impekable Design创建的一款Adobe XD免费工具包资源。


Dashboard-ui-kit-xd


免费下载


42. FREE Dashboard UI Kit

专为Adobe XD设计的免费Dashboard UI工具包。


FREE Dashboard UI Kit


免费下载


43. Web SaaS Dashboard UI工具包

可用于Sketch、Adobe XD和 Photoshop的SaaS Dashboard UI工具包。


Web SaaS Dashboard UI kit


免费下载


44. 40 Web Dashboard UI工具包

包含40个Dashboard UI屏幕的工具包。


40 Web Dashboard UI kit


免费下载


45. Datta Dashboard UI工具包

该Dashboard UI套件包含130多个定制设计组件,适用于Sketch,Photoshop和XD。


Datta-dashboard-ui-kit


免费下载


46. Dashboard UI Kit 3.0

第一个也是最大的网络应用程序和Dashboard设计工具包,在React中开发,适用于Sketch,Adobe Photoshop和Adobe XD。


Dashboard UI Kit 3.0


免费下载


47. Flatkit

界面非常美观的Web应用程序UI工具包。


Flatkit-dashboard-ui-kit


免费下载


48. Dashboard Icons

36个Dashboard图标资源。


Dashboard Icons


免费下载


49. Dashboard UI Kit

该工具包具有Admin Dashboard模板和UI框架,专注于Dashboard用户界面和Web应用程序设计。


Dashboard-ui-kit-admin


免费下载


50. Finance Dashboard UI Kit

财务和银行Dashboard Web App UI工具包。


Finance Dashboard UI Kit


免费下载


以上就是Mockplus为大家精选的50款Dashboard模板和UI工具包,这些都是比较优质的资源,可以很好的用起来哦。当然咯,你也可以使用Mockplus自己设计Dashboard原型。小摹自己做了一个:


Mockplus项目例子-Asana Web(Web,工具类)


主要页面:登录注册页面、主页、任务列表页面、添加任务页面、菜单页面、日历页面等。


Mp文件下载:点击这里


在线预览:http://run.mockplus.cn/Lm5KgRAUJPl2YQFS/index.html


你也可以试试哦~


【来啦!彩蛋君】Mockplus个人版免费赠送福利!限时限量!

Mockplus对接iDoc了,将原型接入产品工作流,增加了原型标注、评论、对比设计稿、全貌呈现等功能,诚邀体验!赠送Mockplus个人版!数量有限,先到先得!

专属激活码:Mock2019;

激活数量:限量150个;

有效期:2019年9月30日

激活地址:https://www.mockplus.cn/user/upgrade (登录/注册后输入激活码即可)

Plus,发布Mockplus原型到iDoc,还有更多大礼等你拿!

原型工具难上手、速度慢?试试Mockplus!

_____

Mockplus,更快更简单的原型设计工具。快速创建原型,一键拖拽创建交互,团队协作省事省力。微软、华为、东软、育碧、Oracle、西门子、IBM等全球知名企业和全球300多所高校都在用,你也可以免费开始你的设计!

免费下载
logo

咨询客服

帮助群:629143492 加入QQ群

服务邮箱:service@jongde.com

咨询客服

在线客服

置顶