整合营销服务商
电脑端+手机端+微信端=数据同步管理
免费咨询热线：
电脑端+手机端+微信端=数据同步管理
免费咨询热线：
变色的搭配能够在H5当道的移动端，显示出强悍的吸睛效果。那如何搭配一个漂亮的渐变色，就变成了我们网店装修，自媒体包装的难点。
并不是人人都懂设计，我们缺乏的是审美灵感。而下面推荐的这一款工具，能够给你提供最丰富的渐变配色灵感。
该工具本身是一个网站，如需具体网址，请关注“九公子”头条号，私信“渐变配色”。
笔者已经设置自动回复。
好了，下面我们看一下使用流程和具体使用场景。
打开网站我们就能直接看到 N 种配色展现在首页，只需要点击其中一个，就会显示全屏渐变。使用方法也非常简单,直接下载 Sketch/PSD 或复制十六进制颜色编码即可！
网站概览
CSS 样式库的使用
除了直接 copy 一个 CSS代码外，我们可还以下载整个 CSS 样式库，方便在项目上直接调用。首先我们下载这个 CSS 库（笔者自动回复中，带有网址）
STEP 1: 引入 CSS 文件
<html> <head> <link href="webgradients.css" rel="stylesheet"> </head> ...
STEP 2: 给元素加入 class 即可，class 名称就是渐变色的名，比如007 Sunny Morning 对应的 class=”sunny-morning”
<div class="sunny-morning">...</span>
色号代码及CSS源码
下面看一下用渐变配色的案例吧！
在的网页设计千篇一律，越来越多的设计师想尝试更加大胆的色彩搭配，所以我们搜集整理了超齐全的一份包含了58个色彩工具的网站，app还有插件，帮助您做成更好的设计。当然这些色彩搭配不是凭空捏造出来的，而是从各个地方获取来的灵感，结合色彩心理学，这些搭配不仅好看，还符合您更高层次的情感需求。
1.Muzli colors
网址：https://colors.muz.li/
使用此工具可以快速创建编辑调色板，最大的特点是可以根据您创建的色彩搭配直接在app设计模板上预览，并且还能下载。
2. Colorable
网址：https://colorable.jxnblk.com/
这个工具主要查看字体颜色和背景颜色的对比效果。
3. Color Leap — History’s Palettes
网址：https://colorleap.app/home
这个工具可以搜素过去四千年以来使用的180个调色板。
4. Picular
网址：https://picular.co/
这是一个颜色搜索工具，只要输入搜索的关键词，就能像google一样展示相关的颜色，可以复制色号和查看使用该颜色的图片。
5. Colourcode
网址：https://colourco.de/
colourco.de是一款在线设计工具，可以让你非常直观的组合各种颜色。
6. Palettte App
网址：https://palettte.app/
palettte和之前见到的网站不太一样，它是一款色彩编辑和重映射工具，能够帮助你从一个颜色中构建出另外一种颜色，还支持单个颜色的微调
7. Colorinspire
网址：https://www.colorinspire.io/
精选各种色彩灵感，可以马上用在您的设计项目中。
8. ColorSpace
网址：https://mycolor.space/
调色板生成器，以及渐变色工具。只要输入您的颜色，网站马上会生成与之相搭配的渐变色和调色板。
9. Pigment
网址：https://pigment.shapefactory.co/
一种根据光线和颜料生成的清新鲜艳的独特调色板。
10. Adobe Color
网址：https://color.adobe.com/create
这个adobe出品的调色板应该是比较熟悉了，每种颜色方案由五个颜色组成。您可以自己生成，也可以看流行的搭配方案。
11. Colors & Fonts
网址：https://www.colorsandfonts.com/
这是一个为开发者和设计师准备的调色板，渐变色，字体的灵感库。
12. HueSnap
网址：https://www.huesnap.com/
这是一个可以自己创建色彩搭配并与人共享的网站。获取颜色的方式可以读取图片或者自己选择。
13. Culrs
网址：https://culrs.com/
culrs为您提供了一个简单明了的方法来选择调色板。
14. Eva Design System
网址：https://colors.eva.design/
使用深度学习算法生成的调色板。比较赞的是深色模式，可以看颜色在深色背景下的效果。
15. Scale
网址：https://hihayk.github.io/scale/
一种全新的生成颜色的方式。调整两边色颜色，生成中间的混合色。
16. Site Palette
网址：http://palette.site/
一个浏览器插件，可以查看正在访问网页的配色。设计师和前端工程师必备工具。
17. BrandColors
网址：https://brandcolors.net/
集合了500多个不同品牌的官方用色，包含了facebook，Twitter，instagram等。
18. Colorwise
网址：https://colorwise.io/
这个网站在product hunt中的投票最高，应该深受设计师喜欢。
19. HTML Color Codes
网址：https://htmlcolorcodes.com/
使用这个网站可以很容易的为您的网站查找各种颜色的十六进制颜色代码，RGB色值，HSL色值。
20. ColorBox
网址：https://www.colorbox.io/
这是一个生成渐变色色值的工具。
21. Generate — Coolors.co
网址：https://coolors.co/
快速生成各种调色板的网站，您可以保存分享这些配色方案。
22. Color — Cloudflare Design
网址：https://cloudflare.design/color/
用于ui界面设计的调色板工具，可以实时查看背景文字图标选择框的颜色效果。
23. Instant Duotone Effect Generator
网址：https://duotones.co/
上传图片，就能查看图片生成漂亮的双色调效果。网站预设十几种常用的双色调配色工具。
24. Color Tool — Material Design
网址：https://material.io/resources/color/#!/?view.left=0&view.right=0
安卓app界面设计的好帮手，可以为安卓界面创建调色板，并测试颜色搭配的可访问性。
25. Blendy
网址：https://blendy.ml/
这是一个快速预览图片通过css代码实现特效后的效果。您可以复制css代码用在您的设计中。
26. LOL Colors
网址：https://www.webdesignrankings.com/resources/lolcolors/
精选挑选的色彩搭配灵感。
27. Color Hunt
网址：https://colorhunt.co/
Color Hunt是一个免费开放的色彩灵感平台，拥有数千种时尚的手工挑选的色彩搭配调色板。
28. ColorMe
网址：https://colorme.io/
可视化的css颜色调试网站。
29. Polarite
网址：https://www.polarite.app/
Polarite是一款机器学习的颜色生成app，用于生成和谐的配色方案。
30. Gradient Hunt
网址：https://gradienthunt.com/
精选了数千种时尚渐变色的网站，每天更新。
31. Palettable
网址：https://www.palettable.io/4EDED7
自动生成一个一个的颜色，让你选择喜欢或者不喜欢。所有向您展示的颜色都是从数百万设计师挑选中生成的。
32. ColorSpark
网址：https://colorspark.app/
一个非常简单的单色和渐变色随机生成器。
33. SVG Colorizer
网址：https://www.iconshock.com/svg-color/
自动为svg图标和插画配色，这些svg文件可以是网站提供的，也能自己上传。
34. Sip
网址：https://sipapp.io/
适用于Mac的拾色软件，可以收集整理分享各种配色方案。
35. CoolHue 2.0
网址：https://webkul.github.io/coolhue/sketch-plugin/
sketch上使用的渐变色调色板插件。
36. Color Koala
网址：https://colorkoala.xyz/
一个快速生成调色板的工具，可以定义深色，浅色，色系。
37. SchemeColor
网址：https://www.schemecolor.com/
这是一个包含了数千个美丽色彩组合的网站，网站不仅可以查看并下载色彩搭配，还有展示色彩搭配的灵感来源图片。
38. Free Mesh Gradient Collection
网址：https://www.ls.graphics/meshgradients
这是一个生成融合在一起的多种渐变色工具的网站，可以下载sketch，ai，eps，jpg等格式。
39. WebGradients
网址：https://webgradients.com/
由顶级设计师策划的180个渐变色，可以下载sketch格式、psd格式文件，保存png文件，获取css3代码。
40. Gradient Buttons
网址：https://gradientbuttons.colorion.co/
渐变色设计的按钮，并且带悬停效果，可以复制css代码用在您的设计中。
41. ColorKit
网址：https://colorkit.io/
色彩混合工具，混合两种颜色生成多个颜色。
42. Eggradients
网址：https://www.eggradients.com/
金蛋形状展示渐变色，可以复制十六进制色值和css代码。
43. Cool Backgrounds
网址：https://coolbackgrounds.io/
带纹理效果的渐变色背景生成器，可以用于博客，网站，桌面，壁纸背景。
44. Google Art & Culture Experiment — Art Palette
网址：https://artsexperiments.withgoogle.com/artpalette/colors/242726-886c5f-d04b18-dfb24a-d4c5aa
结合艺术与文化的体验探索，通过选择色彩搭配搜索艺术作品。
45. GradPad
网址：http://ourownthing.co.uk/gradpad.html
渐变色生成器，随意挪动两个按钮，在网页中创建可爱的渐变色。
46. Khroma
网址：http://khroma.co/
Khroma是生成，发现，搜索和保存您想要使用的颜色组合和调色板的好工具。
47. Color palettes
网址：https://www.canva.com/colors/color-palettes/
浏览Canva的数千种颜色组合！非设计师专用。
48. Color Safe
网址：http://colorsafe.co/
测试网站的颜色使用的可访问性，让您的网站给美观易用。
49. Paletton
网址：http://paletton.com/#uid=1000u0kllllaFw0g0qFqFg0w0aF
使用色轮创建调色板。
50. Colordot
网址：https://color.hailpixel.com/
非常简单的颜色选择器。
51. Colors
网址：https://klart.io/colors/
100％由数据驱动的配色方案集合。
52. Contrast Ratio
网址：https://contrast-ratio.com/
一款轻松计算颜色对比度的配色工具。
53. Color Lisa
网址：http://www.colorlisa.com/
世界上最伟大的艺术家的色彩杰作。
54. Color Designer
网址：https://colordesigner.io/
只需选择一种颜色，Color Designer就会帮助我们构建一个系统的配色方案，并基于我们所选的颜色生成多种色调和阴影等。
55. Color.review
网址：https://color.review/
用于探索和查找可访问颜色的现代工具。确保每个人都能看到您的作品。
56. Blend
网址：http://www.colinkeany.com/blend/
创建和自定义漂亮的CSS3渐变色。
57. Contrast
网址：https://usecontrast.com/
用于快速访问WCAG色彩对比度的macOS软件。
58. Grabient
网址：https://www.grabient.com/
一个非常漂亮且实用的渐变网站，支持 CSS 样式代码复制、360度渐变旋转、自由增加或删除渐变颜色等功能。
这么多的色彩工具就先到这里啦~
如果小伙伴们还发现哪些超赞的配色网站可以留言告诉我们～
为室内设计师的你
是不是时常对配色感到头疼呢？
觉得配色难或是花费时间大？
今天兰姨来分享几个
好用的色彩搭配网站
大家收藏效果更佳~
https://uigradients.com/
Uigradients是以渐变色彩为主的网站，里面接近上百种渐变配色方案，可根据自己风格来选择搭配，点击左上角，就可以浏览所有的配色图，点击你喜欢的图片就可以查看大图，右上角有免费下载的按钮，选好你喜欢的配色就可以直接下载，还可以分享到你的社交账号。
https://color.adobe.com/zh/
Adobe color 是一家在线色轮，提供RGB、CMYK、LAB、SHB、HEX五种色彩模式，非常人性化，用户可以根据自己的配色要求进行实时搭配，是配色的绝佳去处。
Nipponcolors
Nipponcolors日本传统配色网站，网站直接给出了各种颜色的CMYK值，RGB值，以色卡的形式呈现，当你点击某个颜色的色卡时，整个网页都会变成成你选择的这个颜色，方便我们查看这种颜色是否适合大面积的使用。
http://www.flatuicolorpicker.com/
Flat Design应该是设计师们必不可少的一个网站，这个网站能够进行颜色自动分类。
http://colorhunt.co/
该网站是以四色搭配板块展现的，还可以通过PS拾取色彩信息。
http://www.peise.net
中文的配色网，内有许多色彩知识提供学习。有HEX、RGB、CMYK三种模式，可以下载应用到:Photoshop/AI 网页端:HTML/CSS。
https://www.materialpalette.com/
Material Palette是一款提供Material Design配色的线上工具，它的用法很简单，你只要找出想要搭配的两种颜色，它就会显示出两种颜色搭配在一起的效果预览，并提供你较深或较浅的颜色选项，以及其他你可能会用到的颜色代码。
Coolors
Coolors是一个可以让你简单快速地选色生成工具，为你找出配色的灵感，该网站每次会为你挑选由五种颜色组合而成的调色盘，并显示颜色的代码，你可以快速选取使用，或是锁定其中的几种颜色。
http://zhongguose.com/
这是国内相对较好的色彩搭配网站了，提供RGB和CMYK两种色彩模式，十分有中国特色。
Skala Color
Skala Color是一款为设计师和开发者而生的优质取色工具。这款取色器小巧简洁但功能丰富，适用于OS X系统，支持大量的格式（如十六进制、CSS的RGBA模式或HSL模式、UIColor亦或是NSColor等等），在web、iOS、Android、或OS X开发商都能胜任。
https://colordrop.io/
四宫格配色，点一个就能显示四个的色号，直接复制到ps或者是AI，使用起来非常方便。
http://webgradients.com
这里有很多渐变色的运用，有时候脑袋卡壳了，可以在这里寻找颜色的灵感。
https://color.hailpixel.com/
Color by Hailpixel这个网站可以调整色调、亮度、饱和度等等，使用起来十分便捷。
http://colrd.com/
这个网站可以根据颜色、渐变、调色板等寻找图像资料。
ColorHexa
它能帮助我们扩展这个色彩，搭配出数种方案，甚至还有色盲修正方案。如果你只能确定一个必须使用的颜色，选择这个工具或许能获得一些灵感。
Color Scheme Designer
这是一个在线的配色工具，相比于Adobe color ，它拥有详细的色彩修改方法，和简单的颜色演示工具。国内有个旧版本的汉化版，不过还是建议去官网使用最新的。
LOL Colors
这是一个非常简洁，但非常好用的配色网站，设计师们可以在这里找到很多色彩组合，把鼠标移动到不同颜色的水滴上会提示色彩代码(Hex Code)的颜色值。
Colorfavs
用户只需要把一张图片上传到网站上，系统会自动分析图片里的颜色，并生成色系值，系统根据图片推测你喜欢的色盘搭配。
http://www.colourlovers.com/
色彩社区不仅可以配色，还可以共享他人的色彩，共同切磋学习。
https://brandcolors.net/
该网站总结各企业品牌主打的配色，从里面找寻家居配色灵感也是不错的选择。
今天就分享到这啦，希望以上的配色网站能够激发你们配色灵感，在设计的时候，不再让配色成为你烦恼所在！
该文为原创内容
未经授权不得随意转载
*请认真填写需求信息，我们会在24小时内与您取得联系。
