Digital / Web UI
暗色霓虹
一种暗色界面材质，用克制霓虹边缘、强对比和技术感夜间氛围建立识别度。
Dn
适用场景
- AI 工具壳
- 仪表盘
- 开发者落地页
可调参数
- glow radius
- accent hue
- edge width
- contrast
- motion
AI Prompt
生成暗色霓虹界面：石墨底、细青绿边光、克制辉光和清晰排版。避免夜店式混乱。
Tailwind 思路
使用深中性背景、小范围发光阴影、边框强调和少量等宽标签。
性能提醒
少量 box-shadow 发光没问题；避免大量动画发光元素。
CSS
.dark-neon {
border: 1px solid rgba(72, 255, 203, .34);
border-radius: 14px;
background: linear-gradient(180deg, #111615, #080a0a);
box-shadow:
inset 0 1px 0 rgba(255,255,255,.08),
0 0 34px rgba(72, 255, 203, .18);
color: #e9fff8;
}React 示例
export function DarkNeonPanel({ children }) {
return <div className="dark-neon">{children}</div>;
}