颜色格式转换
转换 HEX、RGB、HSL 与透明度，实时查看色样，并复制可直接使用的 CSS 颜色。
CSS 2D 与 3D 变换生成器
调整平移、旋转、缩放、倾斜和变换原点，按需启用透视与三维变换并导出 CSS。
三维选项
预览
虚线标出原始位置。变换顺序会影响效果，导出 CSS 与当前预览保持一致。
CSS
工具介绍
摆放或倾斜界面元素时，可与原始轮廓比较，确定需要的变换参数。
使用说明
先设置 X/Y 平移、旋转、两轴缩放、倾斜及变换原点，参考原位置轮廓查看效果。展开并启用 3D 后，可再调整透视距离、Z 平移与 X/Y 旋转。复制或下载 transform 与 transform-origin 两条声明。
预览与导出使用同一组参数和固定的变换顺序；更改函数顺序可能得到不同效果。负缩放可以翻转元素，零缩放会让对应方向不可见。工具生成元素样式，不生成三维模型或完整动画。
常见问题
能重新排列导出代码里的变换函数吗？
界面不提供函数重排控件；如需调整，请手动编辑导出的 CSS 并重新检查效果。预览和导出采用同一固定顺序，变换顺序会影响结果；负缩放翻转对应轴，零缩放压扁该轴。
元素平移或缩放后，原位置为什么还占着空间？
CSS transform 改变的是元素的绘制效果，不会移动原来的布局盒子，因此周围内容仍按原位置排版。间距应通过正常布局规则处理，视觉变换的支点则由 transform-origin 调整。
相关工具
在新标签页打开
评论
0