帅颜显
高颜值轻量级个人网站 Bootstrap 模板，侧边栏导航+亮暗模式「帅颜显」是一款现代、简洁且高度可定制的个人作品集HTML模板，时尚的侧边栏菜单布局并且支持亮暗模式的调节。专为创意专业人士、开发者、自由职业者、设计师、艺术家、摄影师等需要展示作品的用户设计。...
罗马时钟
CSS+JS实现拥有罗马数字金属骨架外观的罗马模拟时钟通过CSS结合JavaScript实现的罗马模拟时钟，时钟的表盘是通过罗马数字符号的金属架构组成的，相当有金属质感和古老风格的一款时钟效果。并且支持鼠标悬浮显示阿拉布数字的时间提示。实现这一款...
错误提示框
CSS实现创意密码输入框，校验不通过时输入框呈现有趣地晃动动画效果基于CSS实现的一款创意的密码输入框，当用户输入的密码不符合要求（比如长度不足）时，输入框会上下弹跳并且变为红色边框同时显示错误消息。这种设计既有趣又直观，能够吸引用户的注意力并提醒他们修正错误...
进度条
HTML中实现带提示的分段进度条为了提升用户在等待加载过程中的体验，通过React结合CSS技术在HTML页面中实现了一个分段进度条效果，并且在每个阶段在加载过程中都会有加载中的动画以及提示，在完成后提示信息以及加载动画消失变...
提示框
HTML种实现的cookie、重要信息、获奖以及邮件发送四种场景提示框为了在提示用户信息时提升用户体验，基于CSS结合JavaScript设计了四种风格弹出通知（Popup Notification），分别是：cookie提示框、重要信息提示框、获奖通知提示框以...
定制提示框
HTML定制Toast（吐司）通知提示框样式基于CSS结合JavaScript技术在HTML页面中实现支持定制样式的响应式吐司（Toast）通知效果，总共提供了4种风格的提示框，分别是成功提示框、警告提示框、错误提示框以及定时提示框。T...
交互表单
CSS交互效果极佳的登录注册表单，在输入框中显示提示信息！这个效果通过使用CSS伪类 :focus-within、:placeholder-shown 和 :invalid 实现的表单交互效果。这些伪类可以帮助你在用户与表单元素（如输入框）进行交互时，...
加载按钮
CSS按钮的「提交、加载、完成」完整流程动画效果这种按钮加载动画效果是通过使用CSS中的:checked伪类来模拟进度和完成状态，当复选框（checkbox）被选中时，:checked状态会被激活，从而触发预定义的CSS样式变化，这些变化包括...
工具提示框
CSS实现的20款不同形状的工具提示框以及对话信息泡泡基于CSS实现的20种美观大方的工具提示框以及气泡信息对话框，通过CSS设置图形的不同clip-path、border-image以及mask-*等属性实现不同风格的提示框及气泡对话框，可根据提...
消息通知
CSS 创意溅射效果吐司 Toast 通知提示框带来4款极具创意的带溅射效果的吐司 Toast 通知组件，可用在警告提示、错误提示、成功提示以及帮助信息提示场景，通过CSS设置提示信息的background的radial-gradient属性...
预览信息
JavaScript 鼠标悬停消息图标，快捷预览最新提醒信息使用JavaScript结合CSS实现了鼠标悬停在消息图标上预览新信息，当有新消息到达时，消息图标的右上方会出现消息数量，当用户通过鼠标悬停于消息图标之上时，消息数量提示的地方会滚动显示主流的一...
切换
CSS 创意手拨电源开关切换按钮非常有创意的一款状态切换按钮，外观是仿照现实生活中的电源手拨开关按钮设计的，当一边状态被选中/激活时会有按下开关的动画效果，而未被选中/激活的按钮则会翘起来，很有交互性，按钮的提示文案改成需求文...