视觉疲劳的形成往往是由于颜色过于丰富或过于单一形成的麻木感,而 layui 提供的颜色,清新而不乏深沉,互相柔和,不过分刺激大脑皮层的神经反应,形成越久越耐看的微妙影像。合理搭配,可与各式各样的网站避免违和,从而使你的 Web 平台看上去更为融洽。
<link rel="stylesheet" href="/static/layui/css/layui.css">
<script src="/static/layui/layui.all.js" charset="utf-8"></script>
#009688
主色调之一
#5FB878
一般用于选中状态
#393D49
通常用于导航
#1E9FFF
经典蓝
layui 主要是以象征包容的墨绿作为主色调,由于它给人以深沉感,所以通常会以浅黑色的作为其陪衬,又会以蓝色这种比较鲜艳的色调来弥补它的色觉疲劳,整体让人清新自然,愈发耐看。【取色意义】:我们执着于务实,不盲目攀比,又始终不忘绽放活力。这正是 layui 所追求的价值。
#FFB800
暖色系
#FF5722
比较引人注意的颜色
#01AAED
文本链接着色
#2F4056
侧边色
事实上,layui 并非不敢去尝试一些亮丽的颜色,但许多情况下一个它可能并不是那么合适,所以我们把这些颜色归为“场景色”,即按照实际场景来呈现对应的颜色,比如你想给人以警觉感,可以尝试用上面的红色。他们一般会出现在 layui 的按钮、提示和修饰性元素,以及一些侧边元素上。
他们一般用于背景、边框等
#FFFFFF
#FCFCFC
#F0F0F0
#E0E0E0
#d0d0d0
#BEBEBE
#ADADAD
#9D9D9D
#8E8E8E
#7B7B7B
#6C6C6C
#5B5B5B
#4F4F4F
#3C3C3C
#272727
#000000
#FFECEC
#FFD2D2
#FFB5B5
#FF9797
#ff7575
#FF5151
#FF2D2D
#FF0000
#EA0000
#CE0000
#AE0000
#930000
#750000
#600000
#4D0000
#2F0000
#FFF7FB
#FFECF5
#FFD9EC
#FFC1E0
#ffaad5
#FF95CA
#FF79BC
#FF60AF
#FF359A
#FF0080
#F00078
#D9006C
#BF0060
#9F0050
#820041
#600030
#FFF7FF
#FFE6FF
#FFD0FF
#FFBFFF
#ffa6ff
#FF8EFF
#FF77FF
#FF44FF
#FF00FF
#E800E8
#D200D2
#AE00AE
#930093
#750075
#5E005E
#460046
#FAF4FF
#F1E1FF
#E6CAFF
#DCB5FF
#d3a4ff
#CA8EFF
#BE77FF
#B15BFF
#9F35FF
#921AFF
#8600FF
#6F00D2
#5B00AE
#4B0091
#3A006F
#28004D
#FBFBFF
#ECECFF
#DDDDFF
#CECEFF
#B9B9FF
#AAAAFF
#9393FF
#7D7DFF
#6A6AFF
#4A4AFF
#2828FF
#0000E3
#0000C6
#0000C6
#000093
#000079
#ECF5FF
#D2E9FF
#C4E1FF
#ACD6FF
#97CBFF
#84C1FF
#66B3FF
#46A3FF
#2894FF
#0080FF
#0072E3
#0066CC
#005AB5
#004B97
#003D79
#000079
#FDFFFF
#ECFFFF
#D9FFFF
#CAFFFF
#BBFFFF
#A6FFFF
#80FFFF
#4DFFFF
#00FFFF
#00E3E3
#00CACA
#00AEAE
#009393
#007979
#005757
#003E3E
#FBFFFD
#E8FFF5
#D7FFEE
#C1FFE4
#ADFEDC
#96FED1
#7AFEC6
#4EFEB3
#1AFD9C
#02F78E
#02DF82
#02C874
#01B468
#019858
#01814A
#006030
#F0FFF0
#DFFFDF
#CEFFCE
#BBFFBB
#A6FFA6
#93FF93
#79FF79
#53FF53
#28FF28
#00EC00
#00DB00
#00BB00
#00A600
#009100
#007500
#006000
#F5FFE8
#EFFFD7
#E8FFC4
#DEFFAC
#D3FF93
#CCFF80
#C2FF68
#B7FF4A
#A8FF24
#9AFF02
#8CEA00
#82D900
#73BF00
#64A600
#548C00
#467500
#FFFFF4
#FFFFDF
#FFFFCE
#FFFFB9
#FFFFAA
#FFFF93
#FFFF6F
#FFFF37
#F9F900
#E1E100
#C4C400
#A6A600
#8C8C00
#737300
#5B5B00
#424200
#FFFCEC
#FFF8D7
#FFF4C1
#FFF0AC
#FFED97
#FFE66F
#FFE153
#FFDC35
#FFD306
#EAC100
#D9B300
#C6A300
#AE8F00
#977C00
#796400
#5B4B00
#FFFAF4
#FFEEDD
#FFE4CA
#FFDCB9
#FFD1A4
#FFC78E
#FFBB77
#FFAF60
#FFA042
#FF9224
#FF8000
#EA7500
#D26900
#BB5E00
#9F5000
#844200
#FFF3EE
#FFE6D9
#FFDAC8
#FFCBB3
#FFBD9D
#FFAD86
#FF9D6F
#FF8F59
#FF8040
#FF5809
#F75000
#D94600
#BB3D00
#A23400
#842B00
#642100
#F2E6E6
#EBD6D6
#E1C4C4
#D9B3B3
#CF9E9E
#C48888
#B87070
#AD5A5A
#984B4B
#804040
#743A3A
#613030
#E8E8D0
#DEDEBE
#D6D6AD
#CDCD9A
#C2C287
#B9B973
#AFAF61
#A5A552
#949449
#808040
#707038
#616130
#D1E9E9
#C4E1E1
#B3D9D9
#A3D1D1
#95CACA
#81C0C0
#6FB7B7
#5CADAD
#4F9D9D
#408080
#3D7878
#336666
#F3F3FA
#E6E6F2
#D8D8EB
#C7C7E2
#B8B8DC
#A6A6D2
#9999CC
#8080C0
#7373B9
#5A5AAD
#5151A2
#484891
#EBD3E8
#E2C2DE
#DAB1D5
#D2A2CC
#CA8EC2
#C07AB8
#B766AD
#AE57A4
#9F4D95
#8F4586
#7E3D76
#6C3365
layui 认为灰色系代表极简,因为这是一种神奇的颜色,几乎可以与任何元素搭配,不易形成视觉疲劳,且永远不会过时。低调而优雅!
layui 内置了七种背景色,以便你用于各种元素中,如:徽章、分割线、导航等等
“不热衷于视觉设计的程序猿不是一个好作家!” ——贤心
layui - 在每一个细节中,用心与你沟通