![网页设计与网站建设完全实战手册](https://wfqqreader-1252317822.image.myqcloud.com/cover/459/27110459/b_27110459.jpg)
上QQ阅读APP看书,第一时间看更新
文前彩图
3.1 色彩基础知识 3.2 色彩的三要素 3.3 色彩与心理
![](https://epubservercos.yuewen.com/163668/15477638404524106/epubprivate/OEBPS/Images/00001.jpg?sign=1739340109-i9ajmVa13jRj5bWz6zd8Cne60vRvLD7E-0-bb758341753d1aebdc51e1091ee58977)
图3-1 阳光被分解后的7种主要颜色
![](https://epubservercos.yuewen.com/163668/15477638404524106/epubprivate/OEBPS/Images/00002.jpg?sign=1739340109-FxZi2A46SNm9o5Xf6x01LeQqmRv0jEg1-0-13f2571e166df5f9fba1d3fe8fa11fab)
图3-2 相近色
![](https://epubservercos.yuewen.com/163668/15477638404524106/epubprivate/OEBPS/Images/00003.jpg?sign=1739340109-efOBrAP5rojzKVgJNAhRE2xzJTbqv4vp-0-0bf34a2c3141bb217b7a14833a996699)
图3-3 互补色
![](https://epubservercos.yuewen.com/163668/15477638404524106/epubprivate/OEBPS/Images/00004.jpg?sign=1739340109-S54dQnVRpVKjI16eM4j5yStNQczgxs2A-0-66899e16874ac3e6bb6ef253a40ef864)
图3-4 暖色
![](https://epubservercos.yuewen.com/163668/15477638404524106/epubprivate/OEBPS/Images/00005.jpg?sign=1739340109-ptqAoNbReeX1MGTfNyautKiQmEWKCYe1-0-65e65b3ef96f75f9c68b8f35b960edd0)
图3-5 冷色
![](https://epubservercos.yuewen.com/163668/15477638404524106/epubprivate/OEBPS/Images/00006.jpg?sign=1739340109-fAwN5Pz2ugfMfsPM6toMkMAeOKMs345V-0-b3575ca122568835b0dfa015d64ee38c)
图3-8 色彩的明度变化
![](https://epubservercos.yuewen.com/163668/15477638404524106/epubprivate/OEBPS/Images/00007.jpg?sign=1739340109-IAbezEDj3qOdkUxZLpfhmehEEvm6dA3E-0-d9d48c8f0653444affefd546829b9543)
图3-7 十二基本色相
![](https://epubservercos.yuewen.com/163668/15477638404524106/epubprivate/OEBPS/Images/00008.jpg?sign=1739340109-ZXRovRUBIIReaZOM7wqclZ25ZZ9Tq7VN-0-7ccc3d2f5ce97363aedbdaeadb01d782)
图3-9 同一色彩的明暗变化
![](https://epubservercos.yuewen.com/163668/15477638404524106/epubprivate/OEBPS/Images/00009.jpg?sign=1739340109-ovRjEAcfbRks0SV1oM2c20zakJXLPwhv-0-f01c6cf3196c939a604ccc22f40a585e)
图3-10 色彩的纯度变化
![](https://epubservercos.yuewen.com/163668/15477638404524106/epubprivate/OEBPS/Images/00010.jpg?sign=1739340109-qyySdA5P28kVHkbTWlA4xh5MnQFcjwOA-0-47cbd8213f927a4eb13d55ffea83ed61)
图3-11 以红色为主的网页
![](https://epubservercos.yuewen.com/163668/15477638404524106/epubprivate/OEBPS/Images/00011.jpg?sign=1739340109-tPK39GYgRSprDTpMpcdWVJIEfENawv6y-0-6c1bc2625615b59583b6a98065635268)
图3-12 以黄色为主的网页
![](https://epubservercos.yuewen.com/163668/15477638404524106/epubprivate/OEBPS/Images/00012.jpg?sign=1739340109-1k4cGNCxiholWsNThvmuujukMy4rqxVd-0-080f5630794da97e59fa5e25b9acac46)
图3-13 以蓝色为主的网页
3.1 色彩基础知识 3.3 色彩与心理
![](https://epubservercos.yuewen.com/163668/15477638404524106/epubprivate/OEBPS/Images/00013.jpg?sign=1739340109-JoRsPAZ4IgMf5JIx0ASHLKFdj7dLD31e-0-db3fcc8e0592934d6ba23e79b5fadfa7)
图3-6 网页安全色
![](https://epubservercos.yuewen.com/163668/15477638404524106/epubprivate/OEBPS/Images/00014.jpg?sign=1739340109-T3UHhxQ8h5xv0TpGMbe7PT4uikLJNOy9-0-77e46245bc706b27894b2a844312441d)
图3-14 以绿色为主的网页
![](https://epubservercos.yuewen.com/163668/15477638404524106/epubprivate/OEBPS/Images/00015.jpg?sign=1739340109-r6GTABiuhhrkoPoLK1iSYR4xuYSLNLPK-0-db4f842d2dd46519ef3607b85e1593b6)
图3-15 以紫色为主的网页
![](https://epubservercos.yuewen.com/163668/15477638404524106/epubprivate/OEBPS/Images/00016.jpg?sign=1739340109-SrWEVopWZEhHcX6enJ2LOLGMb3i9ZpxH-0-7232aaf4afc3702a8455a7e4b0cd6371)
图3-16 以橙色为主的网页
3.3 色彩与心理 3.4 页面色彩搭配
![](https://epubservercos.yuewen.com/163668/15477638404524106/epubprivate/OEBPS/Images/00017.jpg?sign=1739340109-457ymDUULDwsfsR5KsbSiCR7SJdPKJVP-0-fbc8b049675b35f3014d119469415e95)
图3-17 以黑色与灰色为主的网页
![](https://epubservercos.yuewen.com/163668/15477638404524106/epubprivate/OEBPS/Images/00018.jpg?sign=1739340109-nP5cfPdRue55Fu8YPeR93yJbs3UvI2UC-0-5c664014f85c4f21eeda182e63e3badd)
图3-18 以灰色为主的网页
![](https://epubservercos.yuewen.com/163668/15477638404524106/epubprivate/OEBPS/Images/00019.jpg?sign=1739340109-qffVO5qzSn3nvABtqZVqBXJ91BisvVdS-0-2c3155669d6d11c46874d5425fe4929f)
图3-19 色彩的鲜明性
![](https://epubservercos.yuewen.com/163668/15477638404524106/epubprivate/OEBPS/Images/00020.jpg?sign=1739340109-CHW859kyHT4kriTFVQbMj6qzUUNZ7HNy-0-7afe8531586d1e02f58e30543ff19df9)
图3-20 色彩的独特性
![](https://epubservercos.yuewen.com/163668/15477638404524106/epubprivate/OEBPS/Images/00021.jpg?sign=1739340109-VR9eEQ2w2AGTyL1DEcZqsNYbq3Z4vZx7-0-378399d37564a25741c491ebcd16d41e)
图3-21 色彩的适合性
![](https://epubservercos.yuewen.com/163668/15477638404524106/epubprivate/OEBPS/Images/00022.jpg?sign=1739340109-doZsP4r1Q9XztUJi3eWhmNYHDjSMEac6-0-0818c4f2169e21c4549f188deff8fa2b)
图3-22 使用同一种色彩搭配的网页示例
![](https://epubservercos.yuewen.com/163668/15477638404524106/epubprivate/OEBPS/Images/00023.jpg?sign=1739340109-zktkIkyLVsL7p8ukMv2XvtpQUe28rgOz-0-788f9439c52c19797c95c1f8d3a9abfb)
图3-23 色环
![](https://epubservercos.yuewen.com/163668/15477638404524106/epubprivate/OEBPS/Images/00024.jpg?sign=1739340109-ESfOzktJJWi9gkRVufiySy4ZNNEko873-0-6523f8a4ef97512a271def9eef8212b1)
图3-24 原色对比搭配
3.4 页面色彩搭配
![](https://epubservercos.yuewen.com/163668/15477638404524106/epubprivate/OEBPS/Images/00025.jpg?sign=1739340109-k1ai6pcqZimzpqvIajJIvoUnXlHYe5rZ-0-09ffcc27b674c826e6c8ef8c5e978404)
图3-25 互补色
![](https://epubservercos.yuewen.com/163668/15477638404524106/epubprivate/OEBPS/Images/00026.jpg?sign=1739340109-ggzWaMBaDOIZHUL3lqEW9kiHmHsEHAZI-0-ff89f1531288fcf06ed15e32853e44f9)
图3-26 补色对比应用
![](https://epubservercos.yuewen.com/163668/15477638404524106/epubprivate/OEBPS/Images/00027.jpg?sign=1739340109-L2To4oqh8mA6LDzPaDEDxswPfyJYl2xK-0-40eafd99e047a21092c1ef5e4c67bcd9)
图3-27 间色对比
![](https://epubservercos.yuewen.com/163668/15477638404524106/epubprivate/OEBPS/Images/00028.jpg?sign=1739340109-DYbA1KYko5qMS4OdtP7neCqexUSxeuaG-0-df5d80838f7fa99e7a2b27a9384fe02c)
图3-28 绿与橙间色对比
![](https://epubservercos.yuewen.com/163668/15477638404524106/epubprivate/OEBPS/Images/00029.jpg?sign=1739340109-wJ52jqVHHLObAOaF3zKuxJf91bXTcLkq-0-9f2bc426c7c76eb89b285a8c00f86bfb)
图3-29 色彩的面积对比
![](https://epubservercos.yuewen.com/163668/15477638404524106/epubprivate/OEBPS/Images/00030.jpg?sign=1739340109-Jzuhpb2wDBZrLMTfjlVSEv9ktDxOtZ4V-0-575cca816c22d5ff44c776df6e3dce16)
图3-30 色彩的数量不超过3种
![](https://epubservercos.yuewen.com/163668/15477638404524106/epubprivate/OEBPS/Images/00031.jpg?sign=1739340109-WSXwlrCaBdZZvEmxDRiIBGgIin7yiYOF-0-c7347093021541dc993f47c510ef53da)
图3-31 ColorJack配色工具
![](https://epubservercos.yuewen.com/163668/15477638404524106/epubprivate/OEBPS/Images/00032.jpg?sign=1739340109-0UwaOXkjuj43crSORIU23GVSAqOrgXJ8-0-1fd97ffd97823f3323c12e85dea2464d)
图3-32 辅助色