css 16进制透明度对应表

 配色网站：https://colorhunt.co/palettes/light

css 16进制透明度对应表

数值 透明度值 数值 透明度值 数值 透明度值 数值 透明度值 数值 透明度值
0      00            21    36           42    6B            63    A1           84    D6
1      03            22    38           43    6E            64    A3           85    D9
2      05            23    3B           44    70            65    A6           86    DB
3      08            24    3D           45    73           66    A8            87    DE
4      0A            25    40           46    75           67    AB            88    E0
5      0D            26    42           47    78           68    AD           89    E3
6      0F            27    45           48    7A           69    B0            90    E6
7      12            28    47           49    7D           70    B3            91    E8
8      14            29    4A           50    80           71    B5            92    EB
9      17            30    4D           51    82           72    B8            93    ED
10    1A            31    4F           52    85           73    BA            94    F0
11    1C            32    52           53    87           74    BD            95    F2
12    1F            33    54           54    8A           75    BF            96    F5
13    21            34    57           55    8C           76    C2            97    F7
14    24            35    59           56    8F           77    C4            98    FA
15    26            36    5C           57    91           78    C7            99    FC
16    29            37    5E           58    94           79    C9           100   FF
17    2B            38    61           59    96           80    CC
18    2E            39    63           60    99           81    CF
19    30            40    66           61    9C           82    D1
20    33            41    69           62    9E           83    D4

 

 

线性渐变：linear-gradient(direction, color-stop1, color-stop2, ...)

direction【方向值】 angle【角度值】
to right 90deg
to bottom right 135deg
to top right 45deg
to left -90deg|270deg
to top left -45deg|315deg
to bottom left -135deg|225deg
to top 0
to bottom 180deg

径向渐变：radial-gradient(shape size at position, start-color, ..., last-color);
径向渐变类似于线性渐变，除了是从一个中心点向外辐射的。你可以指定中心点的位置。你还可以使其为圆形或者是椭圆形。

shape 确定圆的类型:
ellipse (默认): 指定椭圆形的径向渐变。
circle ：指定圆形的径向渐变

size 定义渐变的大小，可能值：
farthest-corner 渐进终点在离元素中心点最远的角上
farthest-side 渐进终点在离元素中心最远的边上
closest-corner 渐进终点在离元素最近的边上
closest-side 渐进终点在离元素最近的角上

position 定义渐变的位置。可能值：
center（默认）：设置中间为径向渐变圆心的纵坐标值。
top：设置顶部为径向渐变圆心的纵坐标值。
bottom：设置底部为径向渐变圆心的纵坐标值。

示例：非居中渐变 指定渐变开始的具体位置
radial-gradient(
farthest-corner at 40px 40px,
#f35 0%,
#43e 100%
);

radial-gradient(at 0% 30%, red 10px, yellow 30%, #1e90ff 50%);