大家好，我是设计师邱兴，一个学习前端的设计师，今天给大家制作一个用SVG实现的连续进度的仪表盘，SVG相较于Echart来说制作简单，但是效果可以非常丰富。

作为前端炒粉，面对这个"简单"需求时，我望着Element Plus官方文档陷入了沉思 🤔。el-upload组件虽然能完美处理上传，但原生并不支持已上传图片的拖拽排序。于是，当然是选择满足他啦..

今天在使用tailwindcss时，发现配置在tailwind.config.js中的颜色无论如何都不生效，一查才知道4.0 配置方式改变了。 在 Tailwind CSS 4.0 中，自定义颜色的方

本文使用 View Transition API 实现 Element-Plus 主题切换动画，通过 CSS 变量和动态 clip-path 实现点击扩散效果。

在网页上用 CSS 实现《哈利波特与阿兹卡班的囚徒》“活点地图”的魔法效果。借助 CSS 的混合模式、滤镜和关键帧动画，你就可以实现一些在剪辑软件上才能完成的特效。

前言 日常开发过程中，前端程序员经常需要开发一些酷炫的特效，而这些特效大都需要编写CSS3实现。 但我发现一个问题，就是很大一部分前端程序员并不擅长CSS3这门技术，所以一旦遇到复杂一点的特效，就歇菜

先看UI稿 思考 刚开始想着拿两个圆角来拼，但发现中间接触过渡效果很差 需要丝滑的话，想到贝塞尔曲线/正弦曲线，但这样太麻烦，需要用canvas来画 图形计算器 贝塞尔曲线 最后想到用斜边加圆角来拼，

👏SVG 实现拟物态圆环进度条，速速来Get吧~ 🥇文末分享源代码。记得点赞+关注+收藏！！！！

本文将带大家用原生JS手写一个完整的图片预览和查看的功能，无任何第三方依赖，兼容PC与H5，实现触屏双指缩放等，干货满满。