在界面上有很多地方都会用到颜色，比如背景的颜色，文字的颜色，边框的颜色，阴影的颜色等等。

颜色的名字

CSS 支持几种不同的颜色的表达方式，首先是颜色的名字，浏览器支持一些用名字表示的颜色。设置一下 body 元素的背景颜色，用一下浏览器支持的一个颜色的名字，比如 lightcyan，浅青色，再试一下 cyan，青色，然后是 darkcyan，深青色。

VSCode 编辑器会在这个颜色名字的旁边显示这个颜色的预览，鼠标放在上面，会显示 VSCode 编辑器的颜色选择器，通过这个选择器，我们可以选择自己需要的颜色。

rgb

这个 darkcyan 如果用 rgb 的形式表示的话，它的值就是这个 rgb(0, 139, 139)，括号里的这三个数字值分别表示的是这款颜色的红绿蓝这三种颜色的强度。这个数字值是从 0 到 255 之间的数字。

hex

鼠标点击这个颜色值可以切换使用不同的方式表达颜色，比如 hex 指的是十六进制的颜色，这种方式表达的颜色会用 # 号开头，后面跟着六位字符。darkcyan 这款颜色如果用 hex 表示的话，也就是用十六进制表示的话，它的值应该是 #008b8b。

透明度

默认的颜色都是不透明的，我们也可以设置颜色的透明度，在用十六进制表示的颜色里面加入透明度，会在颜色值里加上两位字符，这两位字符表示的就是颜色的透明度。鼠标放在这个颜色的上面，在弹出的颜色选择器里面，上下拖动这个透明度滑块可以设置颜色的透明度。

另外使用带透明度的颜色比较常用的方式是用 rgba 表示的颜色，rgb 是颜色的红绿蓝的强度，最后的 a 表示 alpha，也就是透明度。用颜色选择器把颜色值换成用 rgba 表示的颜色，括号里的最后一个数字指的就是颜色的透明度，它的值是从 0 到 1 之间的数字，0 是完全透明，1 表示不透明。