将iOS风格的液体玻璃添加到您的网页，只需将粘贴到任何网页的控制台(console)即可。

变种数字消消乐 – 令人沉迷的数字游戏

说真的，这个扑克魔术会让你大开眼界。

懒人的俄罗斯方块游戏

我们成为我们所看到的 – 一个关于新闻循环、恶性循环、无限循环的游戏

本作品没有 JavaScript。 所有逻辑均 100% 由纯 HTML 和 CSS 生成

点击 “任意位置”，查看面孔的旋转。尽量不要尖叫。- 视觉错觉与解释

Rust、2D 模拟、物理模拟、布料模拟、Rust Wasm、交互式演示、软体、webassembly 模拟、游戏物理、粒子系统、程序动画

挑战经典的青蛙跳跃谜题。通过策略移动引导青蛙穿过池塘。您能解决所有关卡吗？

网页小游戏：戳破泡泡

CSS grid 布局代码生成器是一款帮助开发人员更轻松地创建自定义 CSS 网格布局的工具。 生成器允许用户指定列数、行数和 gap 大小。

通过 一个 Div 用 CSS 作画

我在挑战小青蛙过河，你也来啊！

数字消消乐

当我们真正掌握了 Flexbox 布局模式的奥秘，我们就能构建出绝对令人难以置信的作品。无需任意断点即可伸缩的流体布局。在本实用互动教程中，我们将揭开 Flexbox 算法的神秘面纱，学习如何利用它实现非凡的效果。

CSS Grid 是在网络上构建布局的强大工具，但就像所有强大的工具一样，它也有一个显著的学习曲线。在本教程中，我们将建立一个认识模型，了解 CSS Grid 如何工作，以及如何有效地使用它。我将与大家分享我在学习过程中最大的 灵光一现。

弹跳球：通用各种 Web 动画技实现弹跳球来比较各种 Web 技术

将网页漂亮的打印到纸上的CSS

在过去，元素居中是 CSS 中最棘手的事情之一。随着 CSS 语言的发展，我们有了很多新工具可以使用……但我们该如何选择最佳方案呢？何时使用 Flexbox、CSS Grid 或其他工具？让我们一探究竟。

通过本分步开发，学习创建一个很酷的 SVG 加载旋转器。我们将使用 stroke-dasharray 和 stroke-dashoffset 等属性来简化操作

二维码基本原理介绍，包括掩码信息，编码信息，读取顺序，长度解码，内容解码

这是一个小小的应用程序，可用于探索正弦波的谐波序列。你可以单独控制一些谐波（频率为基频整数倍的正弦波），然后聆听结果。

乒乓球战争

这是一款仅使用 CSS 的 loading 效果生成配置工具，可让您毫不费力地为自己的网站定制和生成令人惊叹的加载器。只需复制和粘贴，无需任何安装或依赖麻烦。

利用 CSS3 3D 变换和一些 Javascript 创建类似 3D 的云朵。

HTML 美丽螺旋图生成器

一个能帮你自动生成 ffmpeg 命令行参数的工具

请在下面输入您的年收入，我们来做一个有趣的对比：测一测

用交互式动画帮你理解SVG绘制弧线，二次、三次贝塞尔曲线

用25个例子一步步学习 SVG 绘制图片技术

世界地理游戏：乘飞机从A国到B国途经哪些国家？

我们使用预训练的扩散模型
制造视错觉

门萨智商测试( Mensa) 可以用来测试一个人的认知能力水平（IQ），所有的题目都是考察图形观察推演能力，不需要测试者具备某些专业或数学知识技能。

【女性身体可视化修身工具】用鼠标在人体上拖拽可旋转角度

Flexbox布局模式给网页布局提供了极大的方便，它更grid布局一样都是新出现的新型布局模式，为了让web开发者更容易的理解这种布局，本页内容提供了一个学习实验flexbox布局的场所，让大家更快更容易的了解flexbox布局的语法、用法和使用场景