菜谱布局
CSS 极具创意的菜谱介绍网页布局使用纯CSS实现的烹饪过程菜谱介绍网页布局效果，该布局划分为两大区域，分别是食材图文介绍区以及烹饪过程视频区，两大区域可通过按钮平滑切换，其中的食材区可放置菜品成品图片以及所需要的食材和烹饪时间...
消息通知
CSS 创意溅射效果吐司 Toast 通知提示框带来4款极具创意的带溅射效果的吐司 Toast 通知组件，可用在警告提示、错误提示、成功提示以及帮助信息提示场景，通过CSS设置提示信息的background的radial-gradient属性...
四子棋
CSS 标准的四子棋小游戏只使用CSS实现的标准版四子棋小游戏，使用CSS初始化的棋盘棋子共有6行7列，基本规则: 双方轮流将棋子放进棋盘各类未全满的一列中，棋子会落到每列中最底未被占据的位置。 各类一方先完成四子连珠，...
预加载器
CSS 金币旋转跳跃loading预加载动画效果CSS实现的发光金币腾空跳跃旋转加载中动画效果，使用了CSS的animation-duration、animation-timing-function、animation-iteration-c...
文字标记
纯 CSS 实现的轻量级文本高亮标记效果只使用 CSS 实现的文本不同颜色高亮显示文本效果，可以突出标记重点段落或文字，非常的轻量级，只需要在需要将需要高亮突出的文本置于*-highlight标签中即可，*代表的是颜色，比如green...
电流特效
SVG 电流流动能量环绕闪电动画效果通过svg结合css实现的一个充满能量和动感的能量球或电源图标，其周围环绕着流动的彩色光线，暗示着强大的能量释放或数据传输的过程。中间的闪电图标会呈现能量流动的动画效果，这款富有创意的动态视觉...
团队展示
Tailwind CSS 轮盘交互式团队展示动画效果创意十足的轮盘交互式团队展示效果，是基于 Tailwind CSS 实现的，并且实现了明暗主题模式切换的效果。团队人员围绕圆环进行分布展示，类似于轮盘的效果。当点击员工头像时该员工会置于圆环中心...
步骤流转
CSS + JS 实现的多步骤多状态流转动画效果这是一款多功能实用的状态、多步骤手动驱动前后流转动画效果，其中 CSS 实现了状态、步骤节点的横向规范布局以及状态流转时的连线动画效果，JavaScript负责手动驱动步骤流转事件的实现。使用起...
奥菲恩
慈善与筹款非营利组织 HTML 响应式模板这是一款现代化的 HTML5 模板，基于响应式框架 Bootstrap5x 进行构建，专为非营利组织、慈善机构、众筹项目、NGO、慈善、捐款、基金会、红十字会、公益和筹款网站设计。这个模板不仅...
轮播特性
Swiper 动感十足的百叶窗轮播图动画效果这是一款使用Swiper + Particles + 少许CSS 创建的百叶窗轮播效果插件，下方带有圆点轮播进度指示器，能够通过指示器直观地观察图片切换的进度，可通过点击图片或者滚动鼠标两种方式...
预览信息
JavaScript 鼠标悬停消息图标，快捷预览最新提醒信息使用JavaScript结合CSS实现了鼠标悬停在消息图标上预览新信息，当有新消息到达时，消息图标的右上方会出现消息数量，当用户通过鼠标悬停于消息图标之上时，消息数量提示的地方会滚动显示主流的一...
3D旋转卡片
gsap.js 360度卡片原地旋转3D动画效果基于 gsap.js 以及 CSS 实现的3D带光影效果的360度原地旋转卡片效果，适用于银行卡、票券等卡片展示场景使用，附带逼真的光影效果特别的炫酷，卡片表面的文案、图片以及票券旋转速度支持...