登录 注册

99% 的人可辨别的颜色色卡 - 配色方案分享

本贴最后更新于 653 天前，其中的信息可能已经时移俗易

原文参考链接：https://sashamaps.net/docs/resources/20-colors/

image.png

效果如下：

image.png
截图 20230615004634.png

json 文件

直接复制导入

{
	"name": "Distinct_Colors",
	"light": {
		"font-background12": {
			"border-top-left-radius": "5px",
			"border-top-right-radius": "5px",
			"border-bottom-right-radius": "5px",
			"border-bottom-left-radius": "5px",
			"border-top-color": "rgba(255,255,255,0.1)",
			"border-right-color": "rgba(255,255,255,0.1)",
			"border-bottom-color": "rgba(255,255,255,0.1)",
			"border-left-color": "rgba(255,255,255,0.1)",
			"border-top-width": "1px",
			"border-right-width": "1px",
			"border-bottom-width": "1px",
			"border-left-width": "1px",
			"border-top-style": "groove",
			"border-right-style": "groove",
			"border-bottom-style": "groove",
			"border-left-style": "groove",
			"background-color": "rgba(240, 50, 230, 0.8)"
		},
		"font-background10": {
			"border-top-left-radius": "5px",
			"border-top-right-radius": "5px",
			"border-bottom-right-radius": "5px",
			"border-bottom-left-radius": "5px",
			"border-top-color": "rgba(255,255,255,0.1)",
			"border-right-color": "rgba(255,255,255,0.1)",
			"border-bottom-color": "rgba(255,255,255,0.1)",
			"border-left-color": "rgba(255,255,255,0.1)",
			"border-top-width": "1px",
			"border-right-width": "1px",
			"border-bottom-width": "1px",
			"border-left-width": "1px",
			"border-top-style": "groove",
			"border-right-style": "groove",
			"border-bottom-style": "groove",
			"border-left-style": "groove",
			"background-color": "rgba(66, 212, 244, 0.8)"
		},
		"font-background7": {
			"border-top-left-radius": "5px",
			"border-top-right-radius": "5px",
			"border-bottom-right-radius": "5px",
			"border-bottom-left-radius": "5px",
			"border-top-color": "rgba(255,255,255,0.1)",
			"border-right-color": "rgba(255,255,255,0.1)",
			"border-bottom-color": "rgba(255,255,255,0.1)",
			"border-left-color": "rgba(255,255,255,0.1)",
			"border-top-width": "1px",
			"border-right-width": "1px",
			"border-bottom-width": "1px",
			"border-left-width": "1px",
			"border-top-style": "groove",
			"border-right-style": "groove",
			"border-bottom-style": "groove",
			"border-left-style": "groove",
			"background-color": "rgba(245, 130, 49, 0.8)"
		},
		"font-background3": {
			"border-top-left-radius": "5px",
			"border-top-right-radius": "5px",
			"border-bottom-right-radius": "5px",
			"border-bottom-left-radius": "5px",
			"border-top-color": "rgba(255,255,255,0.1)",
			"border-right-color": "rgba(255,255,255,0.1)",
			"border-bottom-color": "rgba(255,255,255,0.1)",
			"border-left-color": "rgba(255,255,255,0.1)",
			"border-top-width": "1px",
			"border-right-width": "1px",
			"border-bottom-width": "1px",
			"border-left-width": "1px",
			"border-top-style": "groove",
			"border-right-style": "groove",
			"border-bottom-style": "groove",
			"border-left-style": "groove",
			"background-color": "rgba(70, 153, 144, 0.8)"
		},
		"font-background1": {
			"border-top-left-radius": "5px",
			"border-top-right-radius": "5px",
			"border-bottom-right-radius": "5px",
			"border-bottom-left-radius": "5px",
			"border-top-color": "rgba(255,255,255,0.1)",
			"border-right-color": "rgba(255,255,255,0.1)",
			"border-bottom-color": "rgba(255,255,255,0.1)",
			"border-left-color": "rgba(255,255,255,0.1)",
			"border-top-width": "1px",
			"border-right-width": "1px",
			"border-bottom-width": "1px",
			"border-left-width": "1px",
			"border-top-style": "groove",
			"border-right-style": "groove",
			"border-bottom-style": "groove",
			"border-left-style": "groove",
			"background-color": "rgba(128, 0, 0, 0.8)"
		},
		"font-background2": {
			"border-top-left-radius": "5px",
			"border-top-right-radius": "5px",
			"border-bottom-right-radius": "5px",
			"border-bottom-left-radius": "5px",
			"border-top-color": "rgba(255,255,255,0.1)",
			"border-right-color": "rgba(255,255,255,0.1)",
			"border-bottom-color": "rgba(255,255,255,0.1)",
			"border-left-color": "rgba(255,255,255,0.1)",
			"border-top-width": "1px",
			"border-right-width": "1px",
			"border-bottom-width": "1px",
			"border-left-width": "1px",
			"border-top-style": "groove",
			"border-right-style": "groove",
			"border-bottom-style": "groove",
			"border-left-style": "groove",
			"background-color": "rgba(154, 99, 36, 0.8)"
		},
		"font-background4": {
			"border-top-left-radius": "5px",
			"border-top-right-radius": "5px",
			"border-bottom-right-radius": "5px",
			"border-bottom-left-radius": "5px",
			"border-top-color": "rgba(255,255,255,0.1)",
			"border-right-color": "rgba(255,255,255,0.1)",
			"border-bottom-color": "rgba(255,255,255,0.1)",
			"border-left-color": "rgba(255,255,255,0.1)",
			"border-top-width": "1px",
			"border-right-width": "1px",
			"border-bottom-width": "1px",
			"border-left-width": "1px",
			"border-top-style": "groove",
			"border-right-style": "groove",
			"border-bottom-style": "groove",
			"border-left-style": "groove",
			"background-color": "rgba(0, 0, 117, 0.5)"
		},
		"font-background5": {
			"border-top-left-radius": "5px",
			"border-top-right-radius": "5px",
			"border-bottom-right-radius": "5px",
			"border-bottom-left-radius": "5px",
			"border-top-color": "rgba(255,255,255,0.1)",
			"border-right-color": "rgba(255,255,255,0.1)",
			"border-bottom-color": "rgba(255,255,255,0.1)",
			"border-left-color": "rgba(255,255,255,0.1)",
			"border-top-width": "1px",
			"border-right-width": "1px",
			"border-bottom-width": "1px",
			"border-left-width": "1px",
			"border-top-style": "groove",
			"border-right-style": "groove",
			"border-bottom-style": "groove",
			"border-left-style": "groove",
			"background-color": "rgba(0, 0, 0, 0.4)"
		},
		"font-background6": {
			"border-top-left-radius": "5px",
			"border-top-right-radius": "5px",
			"border-bottom-right-radius": "5px",
			"border-bottom-left-radius": "5px",
			"border-top-color": "rgba(255,255,255,0.1)",
			"border-right-color": "rgba(255,255,255,0.1)",
			"border-bottom-color": "rgba(255,255,255,0.1)",
			"border-left-color": "rgba(255,255,255,0.1)",
			"border-top-width": "1px",
			"border-right-width": "1px",
			"border-bottom-width": "1px",
			"border-left-width": "1px",
			"border-top-style": "groove",
			"border-right-style": "groove",
			"border-bottom-style": "groove",
			"border-left-style": "groove",
			"background-color": "rgba(230, 25, 75, 0.8)"
		},
		"font-background8": {
			"border-top-left-radius": "5px",
			"border-top-right-radius": "5px",
			"border-bottom-right-radius": "5px",
			"border-bottom-left-radius": "5px",
			"border-top-color": "rgba(255,255,255,0.1)",
			"border-right-color": "rgba(255,255,255,0.1)",
			"border-bottom-color": "rgba(255,255,255,0.1)",
			"border-left-color": "rgba(255,255,255,0.1)",
			"border-top-width": "1px",
			"border-right-width": "1px",
			"border-bottom-width": "1px",
			"border-left-width": "1px",
			"border-top-style": "groove",
			"border-right-style": "groove",
			"border-bottom-style": "groove",
			"border-left-style": "groove",
			"background-color": "rgba(255, 225, 25, 0.8)"
		},
		"font-background9": {
			"border-top-left-radius": "5px",
			"border-top-right-radius": "5px",
			"border-bottom-right-radius": "5px",
			"border-bottom-left-radius": "5px",
			"border-top-color": "rgba(255,255,255,0.1)",
			"border-right-color": "rgba(255,255,255,0.1)",
			"border-bottom-color": "rgba(255,255,255,0.1)",
			"border-left-color": "rgba(255,255,255,0.1)",
			"border-top-width": "1px",
			"border-right-width": "1px",
			"border-bottom-width": "1px",
			"border-left-width": "1px",
			"border-top-style": "groove",
			"border-right-style": "groove",
			"border-bottom-style": "groove",
			"border-left-style": "groove",
			"background-color": "rgba(60, 180, 75, 0.8)"
		},
		"font-background11": {
			"border-top-left-radius": "5px",
			"border-top-right-radius": "5px",
			"border-bottom-right-radius": "5px",
			"border-bottom-left-radius": "5px",
			"border-top-color": "rgba(255,255,255,0.1)",
			"border-right-color": "rgba(255,255,255,0.1)",
			"border-bottom-color": "rgba(255,255,255,0.1)",
			"border-left-color": "rgba(255,255,255,0.1)",
			"border-top-width": "1px",
			"border-right-width": "1px",
			"border-bottom-width": "1px",
			"border-left-width": "1px",
			"border-top-style": "groove",
			"border-right-style": "groove",
			"border-bottom-style": "groove",
			"border-left-style": "groove",
			"background-color": "rgba(67, 99, 216, 0.88)"
		},
		"font-background13": {
			"border-top-left-radius": "5px",
			"border-top-right-radius": "5px",
			"border-bottom-right-radius": "5px",
			"border-bottom-left-radius": "5px",
			"border-top-color": "rgba(255,255,255,0.1)",
			"border-right-color": "rgba(255,255,255,0.1)",
			"border-bottom-color": "rgba(255,255,255,0.1)",
			"border-left-color": "rgba(255,255,255,0.1)",
			"border-top-width": "1px",
			"border-right-width": "1px",
			"border-bottom-width": "1px",
			"border-left-width": "1px",
			"border-top-style": "groove",
			"border-right-style": "groove",
			"border-bottom-style": "groove",
			"border-left-style": "groove",
			"background-color": "rgba(169, 169, 169, 0.44)"
		}
	},
	"dark": {}
}
​
  • 思源笔记

    思源笔记是一款隐私优先的个人知识管理系统，支持完全离线使用，同时也支持端到端加密同步。

    融合块、大纲和双向链接，重构你的思维。

    24812 引用 • 102077 回帖
  • CSS

    CSS（Cascading Style Sheet）“层叠样式表”是用于控制网页样式并允许将样式信息与网页内容分离的一种标记性语言。

    199 引用 • 541 回帖 • 1 关注
  • 分享

    有什么新发现就分享给大家吧！

    247 引用 • 1794 回帖
深圳 位置
3 感谢
6 收藏
3 赞同
8 回帖
2
2
1.1k 469 42 250 18 7 352

相关帖子

8 回帖
99% 的人可辨别的颜色色卡 - 配色方案分享

欢迎来到这里！

我们正在构建一个小众社区，大家在这里相互信任，以平等 • 自由 • 奔放的价值观进行分享交流。最终，希望大家能够找到与自己志同道合的伙伴，共同成长。

注册 关于
请输入回帖内容 ...
请输入回帖内容 ...
lake0hp
深圳
回帖
2
 帖子
2
 积分
870

近期热议

推荐标签 标签

  • VirtualBox

    VirtualBox 是一款开源虚拟机软件，最早由德国 Innotek 公司开发，由 Sun Microsystems 公司出品的软件，使用 Qt 编写，在 Sun 被 Oracle 收购后正式更名成 Oracle VM VirtualBox。

    10 引用 • 2 回帖 • 14 关注
  • flomo

    flomo 是新一代 「卡片笔记」 ，专注在碎片化时代，促进你的记录，帮你积累更多知识资产。

    6 引用 • 140 回帖
  • 强迫症

    强迫症（OCD）属于焦虑障碍的一种类型，是一组以强迫思维和强迫行为为主要临床表现的神经精神疾病，其特点为有意识的强迫和反强迫并存，一些毫无意义、甚至违背自己意愿的想法或冲动反反复复侵入患者的日常生活。

    15 引用 • 161 回帖 • 1 关注
  • Sandbox

    如果帖子标签含有 Sandbox ，则该帖子会被视为“测试帖”，主要用于测试社区功能，排查 bug 等，该标签下内容不定期进行清理。

    427 引用 • 1250 回帖 • 597 关注
  • 反馈

    Communication channel for makers and users.

    126 引用 • 929 回帖 • 268 关注
  • 创造

    你创造的作品可能会帮助到很多人，如果是开源项目的话就更赞了！

    183 引用 • 1010 回帖
  • Flume

    Flume 是一套分布式的、可靠的，可用于有效地收集、聚合和搬运大量日志数据的服务架构。

    9 引用 • 6 回帖 • 652 关注
  • 笔记

    好记性不如烂笔头。

    310 引用 • 794 回帖
  • Notion

    Notion - The all-in-one workspace for your notes, tasks, wikis, and databases.

    10 引用 • 76 回帖 • 1 关注
  • 大疆创新

    深圳市大疆创新科技有限公司(DJI-Innovations，简称 DJI)，成立于 2006 年，是全球领先的无人飞行器控制系统及无人机解决方案的研发和生产商，客户遍布全球 100 多个国家。通过持续的创新，大疆致力于为无人机工业、行业用户以及专业航拍应用提供性能最强、体验最佳的革命性智能飞控产品和解决方案。

    2 引用 • 14 回帖
  • 脑图

    脑图又叫思维导图，是表达发散性思维的有效图形思维工具 ，它简单却又很有效，是一种实用性的思维工具。

    31 引用 • 97 回帖
  • C

    C 语言是一门通用计算机编程语言，应用广泛。C 语言的设计目标是提供一种能以简易的方式编译、处理低级存储器、产生少量的机器码以及不需要任何运行环境支持便能运行的编程语言。

    85 引用 • 165 回帖 • 1 关注
  • 博客

    记录并分享人生的经历。

    273 引用 • 2388 回帖 • 1 关注
  • Flutter

    Flutter 是谷歌的移动 UI 框架，可以快速在 iOS 和 Android 上构建高质量的原生用户界面。 Flutter 可以与现有的代码一起工作，它正在被越来越多的开发者和组织使用，并且 Flutter 是完全免费、开源的。

    39 引用 • 92 回帖 • 2 关注
  • 房星科技

    房星网，我们不和没有钱的程序员谈理想，我们要让程序员又有理想又有钱。我们有雄厚的房地产行业线下资源，遍布昆明全城的 100 家门店、四千地产经纪人是我们坚实的后盾。

    6 引用 • 141 回帖 • 592 关注
  • 周末

    星期六到星期天晚，实行五天工作制后，指每周的最后两天。再过几年可能就是三天了。

    14 引用 • 297 回帖 • 3 关注
  • Hprose

    Hprose 是一款先进的轻量级、跨语言、跨平台、无侵入式、高性能动态远程对象调用引擎库。它不仅简单易用，而且功能强大。你无需专门学习，只需看上几眼，就能用它轻松构建分布式应用系统。

    9 引用 • 17 回帖 • 618 关注
  • DevOps

    DevOps（Development 和 Operations 的组合词）是一组过程、方法与系统的统称，用于促进开发（应用程序/软件工程）、技术运营和质量保障（QA）部门之间的沟通、协作与整合。

    57 引用 • 25 回帖 • 7 关注
  • Access
    1 引用 • 3 回帖 • 5 关注
  • 叶归
    5 引用 • 16 回帖 • 10 关注
  • Sublime

    Sublime Text 是一款可以用来写代码、写文章的文本编辑器。支持代码高亮、自动完成，还支持通过插件进行扩展。

    10 引用 • 5 回帖
  • 学习

    “梦想从学习开始，事业从实践起步” —— 习近平

    172 引用 • 516 回帖
  • AngularJS

    AngularJS 诞生于 2009 年，由 Misko Hevery 等人创建，后为 Google 所收购。是一款优秀的前端 JS 框架，已经被用于 Google 的多款产品当中。AngularJS 有着诸多特性，最为核心的是：MVC、模块化、自动化双向数据绑定、语义化标签、依赖注入等。2.0 版本后已经改名为 Angular。

    12 引用 • 50 回帖 • 502 关注
  • TextBundle

    TextBundle 文件格式旨在应用程序之间交换 Markdown 或 Fountain 之类的纯文本文件时，提供更无缝的用户体验。

    1 引用 • 2 回帖 • 79 关注
  • Sphinx

    Sphinx 是一个基于 SQL 的全文检索引擎，可以结合 MySQL、PostgreSQL 做全文搜索，它可以提供比数据库本身更专业的搜索功能，使得应用程序更容易实现专业化的全文检索。

    1 引用 • 214 关注
  • Jenkins

    Jenkins 是一套开源的持续集成工具。它提供了非常丰富的插件，让构建、部署、自动化集成项目变得简单易用。

    54 引用 • 37 回帖
  • webpack

    webpack 是一个用于前端开发的模块加载器和打包工具，它能把各种资源，例如 JS、CSS（less/sass）、图片等都作为模块来使用和处理。

    41 引用 • 130 回帖 • 251 关注

最新标签