随机颜色生成器

披露:通过本页面的链接进行购买,我将获得佣金。这有助于维持本网站的运作。

这里有一个有用的随机颜色生成器。它可以生成并显示颜色和十六进制代码,以便在任何图形软件中使用。还显示了CSS代码,因此你可以在网站上使用这些颜色。

每种颜色都有两个版本,一个是白色文本,一个是黑色文本。

hungrily #4A1B1E


.color-hungrily, .color-hover-hungrily:hover {color:#FFF!important; background-color:#4A1B1E!important}

hungrily #4A1B1E


.color-hungrily, .color-hover-hungrily:hover {color:#000!important; background-color:#4A1B1E!important}

perfectly #247254


.color-perfectly, .color-hover-perfectly:hover {color:#FFF!important; background-color:#247254!important}

perfectly #247254


.color-perfectly, .color-hover-perfectly:hover {color:#000!important; background-color:#247254!important}

jovially #AED8DC


.color-jovially, .color-hover-jovially:hover {color:#FFF!important; background-color:#AED8DC!important}

jovially #AED8DC


.color-jovially, .color-hover-jovially:hover {color:#000!important; background-color:#AED8DC!important}

insightfully #65BA3A


.color-insightfully, .color-hover-insightfully:hover {color:#FFF!important; background-color:#65BA3A!important}

insightfully #65BA3A


.color-insightfully, .color-hover-insightfully:hover {color:#000!important; background-color:#65BA3A!important}


 

NordVPN访问任何网上内容


 

用于任何目的的随机颜色

无论你是在为你设计的一些图形寻找灵感,还是在创建一个网站,我们的随机颜色生成器都是一个不错的选择。生成的每一种颜色都有十六进制代码。

我们还展示了这些颜色在白色文本和黑色文本上的效果,以帮助你了解你想如何使用它们。

如果你不喜欢生成的任何颜色,只需按 "生成新的"。不过要注意的是--你不能把旧的颜色找回来,所以如果有你喜欢的颜色,在按下按钮之前复制并保存十六进制代码。

这里有适合所有人的东西。由于可生成的颜色几乎是无限的,你有很多选择可以挑选。

我们是如何生成颜色的

这些颜色是尽可能的随机。它们是通过从十六进制代码的6个不同位置的每一个可能的十六进制字母中随机挑选一个来生成的。

颜色名称

这里显示的颜色名称只是临时名称,我们将其作为占位符使用。如果你需要使用这些颜色,为了你自己的方便,你也许应该把它们重命名为你想要的任何颜色。我们想确保我们给出的名字不会与你的项目中可能使用的其他现有颜色名称相冲突(例如,浅绿色)。

我们给出的颜色名称可能会被其他使用 "生成新颜色 "生成的颜色所重复使用,所以不要认为我们的名称对特定的颜色是唯一的。甚至从理论上讲,同一个页面上的两种不同的颜色拥有相同的名字也是可能的,但可能性不大。

对于网页设计师来说

CSS

如果你打算在网页上使用这些颜色,你要把该颜色的CSS代码(显示在颜色框中)复制并粘贴到你现有的样式表中。记住要决定你是要黑色文本的版本还是白色文本的版本,因为它们的CSS代码是不同的。如上所述,你需要改变你的CSS文件中的颜色名称,最好是对你有意义的颜色,并且在你现有的样式表中没有使用相同的名称。

我们所有的占位符名称都以字母 "ly "结尾,以便在你需要搜索你的样式表时,能更容易找到你可能忘记修改的名称。

HTML

将CSS代码复制到你的样式表中后,你可以在你的HTML中使用任何这些颜色,如下所示。

<div class="angrily">
<h3>Heading</h3>
<p>Paragraph content</p>
</div>

在上面的例子中,你可以看到,把名字改成有意义的颜色可能更好。

深色的背景会自动带有白色的文字,所以你不需要单独指定背景颜色和文字颜色。

此页面的最新更新时间: 2022年10月19日