SuperAPI AI 工具集

dark-mode-design

设计与创作

查看项目

更新于 10-15 22:37

技能介绍

用途:指导设计舒适、可访问且精致的深色模式界面,核心是超越简单颜色反转,重新设计表面与色彩。

主要能力:降低整体亮度以减少眼疲劳;用更浅的色阶(而非阴影)表现表面层级;对亮色去饱和以适配深色背景;保持足够对比度。表面层级示例:背景最深(如 #121212),Surface 1 稍亮(抬升卡片),Surface 2 更亮(模态、下拉),Surface 3 最亮(提示、菜单)。色彩适配:主色饱和度降低 10-20%;错误/警告色针对深色背景调整对比;文字用偏白 #E0E0E0 而非纯白 #FFFFFF;边框用低透明度白色。图像与媒体:可略微调暗图片,提供深色变体插画,Logo 可能需要浅色版本,避免大面积亮区。可访问性:正文对比度至少 4.5:1,用屏幕阅读器测试模式播报,尊重 prefers-color-scheme 媒体查询,并在自动检测之外提供手动切换。最佳实践:不要只做反色,要重新设计表面;在真实深色环境中测试;逐一检查每个组件;模式切换平滑过渡;使用语义化 token 以便切换。

使用方式与限制:资料未提供具体安装命令、调用方式或平台信息,暂未提供。