圆点脉冲背景 · 背景
前端Wiki/CSS 特效合集/圆点脉冲背景

圆点脉冲背景

深色点阵整体呼吸闪烁,沉稳的科技纹理

← 返回 背景 类特效列表

上方为纯 CSS 实时演示,直接将鼠标移上去 / 点击感受效果

CSS 代码

CSS
.fx .dots{height:220px;border-radius:14px;background-image:radial-gradient(#4a9eff 2.5px,transparent 2.5px);background-size:26px 26px;background-color:#0d1117;animation:kfx-dots 2s ease-in-out infinite}
@keyframes kfx-dots{50%{background-image:radial-gradient(rgba(74,158,255,.18) 2.5px,transparent 2.5px)}}

HTML 结构

HTML
<div class="fx">
<div class="dots"></div>
</div>
实现要点:radial-gradient 点阵 + 背景色透明度循环呼吸

其它背景类特效

回到 前端Wiki 首页 · CSS 特效合集