前端开发中经常使用到的颜色：

最新推荐文章于 2026-04-10 17:28:37 发布

原创最新推荐文章于 2026-04-10 17:28:37 发布 · 8.2k 阅读 ·

本内容遵循CC 4.0 BY-SA版权协议

收录于

CSS样式

当前文章被收录于：

CSS样式

27 篇文章 11 人学习

订阅专栏查看详情

前端

当前文章被收录于：

前端

5 篇文章 1 人学习

订阅专栏查看详情

当前文章被以下社区和专栏收录：

代码可运行

本文列举了前端开发中常用的颜色，包括浅绿、深绿、暗蓝、蓝色、深蓝、深紫、浅紫、粉色、红色、橙色、黄色和灰色等，并提供了前端设计中常见的渐变色系示例，如19CAAD到D6D5B7、8CC7B5到D1BA74等，为前端设计师和开发者提供色彩灵感。

（一）前端开发中经常使用到的颜色：

（二）前端常用的渐变色系：

（一）前端开发中经常使用到的颜色：

1. 浅绿 #8cc540

2. 深绿 #009f5d

3. 暗蓝 #019fa0

4. 蓝色 #019fde

5. 深蓝 #007cdc

6. 深紫 #887ddd

7. 浅紫 #cd7bdd

8. 粉色 #ff5675

9. 红色 #ff1244

10. 橙色 #ff8345

11. 黄色 #f8bd0b

12. 灰色 #d1d2d4

（二）前端常用的渐变色系：


███ 19CAAD          ███ D6D5B7
███ 8CC7B5           ███ D1BA74
███ A0EEE1            ███ E6CEAC
███ BEE7E9            ███ ECAD9E
███ BEEDC7          ███ F4606C

阅读完本文您可以尝试下面操作：

标签

#java #大数据 #html

分类 it交互设计（ux）

关注博主即可阅读全文

确定要放弃本次机会？

福利倒计时

: :

立减 ¥

普通VIP年卡可用

立即使用

320种常用颜色对照表

07-01

320种前端常用颜色对照表，包含几乎全部前端常用颜色，包含颜色示意和十六进制颜色值。前端工程师和UI设计师必备。

前端开发：使用Vue自定义柱形图，实现选中柱形图时改变颜色和文字标注颜色

api_git355的博客

09-18

424

在上面的代码中，我们为chart标签添加了一个@click事件监听器，当柱形图被点击时会调用handleChartClick方法。本文将介绍如何使用Vue实现自定义柱形图，并且在选中柱形图时改变柱形图的颜色以及文字标注的颜色。通过Vue的组件化和响应式特性，我们能够轻松地创建交互式的图表，并实现各种定制化的需求。在上面的代码中，我们使用了CSS选择器来选择被选中的柱形图，并设置了其背景颜色和文字标注的颜色为红色。现在，我们已经完成了自定义柱形图并在选中柱形图时改变颜色和文字标注颜色的功能。

参与评论您还未登录，请先登录后发表或查看评论

前端学习5：HTML颜色（什么是RGB、HEX、HSL）

RainstormGod的博客

04-11

3340

无论是RGB、HEX、HSL，它们的作用只有一个：用数字表达出一种颜色。

前端颜色收集(五颜六色----花里胡哨)

知识改变命运，ヾ(◍°∇°◍)ﾉﾞ【求关注】

06-18

1484

最近在写东西时，需要一些颜色填充，然后搜集了一些颜色，提供一下方便：

前端css颜色

热门推荐

在写作的路上持续输出。

04-03

3万+

前端开发当中，我们总会和颜色打交道，那么它的三种表达形式你知道吗？👆

前端开发实战：CSS中16进制颜色透明度的正确使用姿势

weixin_28523493的博客

03-08

261

本文深入解析了CSS中16进制颜色透明度（#AARRGGBB格式）的正确使用方法。从Alpha通道编码原理讲起，通过实战代码示例展示了其在变量定义、渐变叠加等场景下的简洁优势，并提供了浏览器兼容性处理方案与Sass函数等高级技巧，帮助前端开发者写出更统一、高效且易于维护的样式代码。

前端开发·技术技巧：使用js将HSL颜色或十六进制颜色转换为RGB表示方式

CarenStrid的博客

09-29

904

【代码】前端开发·技术技巧：使用js将HSL颜色或十六进制颜色转换为RGB表示方式。

前端开发必备：5分钟搞定HTML5取色器的使用与颜色代码转换

python9snake的博客

02-14

166

本文详细介绍了HTML5取色器的使用与颜色代码转换技巧，帮助前端开发者快速掌握精确控制颜色的方法。通过解析取色器核心功能、颜色格式转换原理及实战应用，提升开发效率，适用于动态主题切换、可视化图表编辑等场景。

html背景颜色竖条,前端开发：使用css实现左边竖条的8种方法

weixin_42367557的博客

07-14

1046

只使用一个标签，可以有多少种实现下面的样式呢?假设我们的单标签是一个 div:定义如下通用CSS：div{position:relative;width:200px;height:60px;background:#ddd;}法一：border这个应该是最最最容易想到的了div{border-left:5pxsoliddeeppink;}法二：使用伪元素一个标签，算上 before 与 afte...

CSS关于颜色使用的理解（单词、RGB、十六进制）

康康

08-08

3512

初入前端，写代码时颜色值一直用的取色器直接取出的十六进制单位，今天看书看到关于颜色的内在常识，记录一下~~ 主要三种表达方式：命名颜色直接用英文单词表示，css规范应该定义了17个颜色名，可以直接查一下。例如： h1 {color:red;} 用RGB指定颜色计算机屏幕通过三原色红、绿、蓝组合成各种颜色。rgb（color）括号里包含三个数字，可以用百分数，也可以用整数。

如何给placeholder更改颜色

玉安_ZhangDe的博客

04-10

7494

<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Do.

实现一个div的背景颜色从左到右慢慢出现

MagicGirl

06-24

4903

怎样实现一个div的背景颜色从左到右慢慢出现？在这里为大家介绍伪类 :after <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> <style> .btn butt...

js生成随机颜色

qq_46183012的博客

03-28

303

js生成随机颜色 function randomColor(){ let chars = '0123456789abcdef' let colorLength = 6 let color = '' for (let i = 0; i < colorLength; i++) { let randomCode = Math.floor(Math.random() * chars.length) color += chars.substring(randomC

前端色彩艺术：深入解析与实战指南

球球不吃虾WHR2349博客

05-28

1940

网页设计常用色彩搭配表 - 配色表

cyzmy的专栏

04-25

2758

网页设计常用色彩搭配表 - 配色表 + 按色相的搭配分类本节将网页设计中常见的色彩搭配按照色相的顺序归类。每类都以该色相为主，配以其他色相或者同色相的，应用对比和调和的方法，并按照从轻快到浓烈的顺序排序。红色 #FFFFCC #CCFFFF #FFCCCC #99CCCC #FFCC99 #FFCCCC #FF999

HTML 颜色、脚本、框架、符号

qq_60271706的博客

09-22

1万+

HTML 颜色采用的是 RGB 颜色，是通过对红 (R)、绿 (G)、蓝 (B) 三个颜色通道的变化以及它们相互之间的叠加来得到各式各样的颜色的，RGB 即是代表红、绿、蓝三个通道的颜色。

前端通用颜色表

q412406513的博客

04-27

656

RGB颜色查询对照表

前端配色设计技巧

2401_84150165的博客

04-09

792

基础知识是前端一面必问的，如果你在基础知识这一块翻车了，就算你框架玩的再6，webpack、git、node学习的再好也无济于事，因为对方就不会再给你展示的机会，千万不要因为基础错过了自己心怡的公司。前端的基础知识杂且多，并不是理解就ok了，有些是真的要去记。当然了我们是牛x的前端工程师，每天像背英语单词一样去背知识点就没必要了，只要平时工作中多注意总结，面试前端刷下题目就可以了。什么？你问面试题资料在哪里，这不是就在你眼前吗（滑稽。

前端开发中经常使用到的颜色：

（一）前端开发中经常使用到的颜色：

（二） 前端常用的渐变色系：

（二）前端常用的渐变色系：