CSS 工具

Bing🐣大约 2 分钟

提示

导航数据完善中，欢迎 👏👏 通过 PR 或者点击下方的在 GitHub 上编辑此页提供其他未收集的站点

CSS 工具

Sass

Sass 是成熟、稳定、强大的 CSS 扩展语言。

Less

Less（Leaner Style Sheets 的缩写）是一门向后兼容的 CSS 扩展语言。

Stylus

富于表现力、动态的、健壮的 CSS。

CSS-Tricks

一个关于运用CSS技术进行网络开发和设计的小技巧的交流网站。

CSS三角形生成器

定义几个参数很方便的生成纯css代码的各种三角形。

Fresh Background Gradients

CSS 个性渐变背景集合。

Fresh Background Gradients

创建各样的 CSS 加载动画。

Codemyui

非常酷的网站，有一堆很酷的 CSS、HTML 和 Javascript 片段。

非常受欢迎的配色网站，提供了大量的精选颜色方案。

一个免费的在线背景生成器，提供了各种类型和风格的背景图像。

SVG Chart Generator

一款设计精美的图表生成器，生成基于 SVG 的折线或条形格式的图表。

Accessible Color Palette Generator

一款调色板生成器。

- icon: 'https://api.liubing.me/favicon/sass-lang.com.png'
  name: Sass
  desc: Sass 是成熟、稳定、强大的 CSS 扩展语言。
  link: https://sass-lang.com/
  github: https://github.com/sass/sass

- icon: 'https://api.liubing.me/favicon/lesscss.org.png'
  name: Less
  desc: Less（Leaner Style Sheets 的缩写）是一门向后兼容的 CSS 扩展语言。
  link: https://lesscss.org/
  github: https://github.com/less/less.js

- icon: 'https://api.liubing.me/favicon/stylus-lang.com.png'
  name: Stylus
  desc: 富于表现力、动态的、健壮的 CSS。
  link: https://stylus-lang.com/
  github: https://github.com/stylus/stylus

- icon: 'https://api.liubing.me/favicon/css-tricks.com.png'
  name: CSS-Tricks
  desc: 一个关于运用CSS技术进行网络开发和设计的小技巧的交流网站。
  link: https://css-tricks.com/

- icon: 'https://api.liubing.me/favicon/liubing.me.png'
  name: CSS三角形生成器
  desc: 定义几个参数很方便的生成纯css代码的各种三角形。
  link: https://liubing.me/tools/css-triangle-generator.html

- icon: 'https://api.liubing.me/favicon/kovart.github.io/dashed-border-generator.png'
  name: Customize Border
  desc: 自定义 CSS Border 边框。
  link: https://kovart.github.io/dashed-border-generator/
  github: https://github.com/kovart/dashed-border-generator

- icon: 'https://api.liubing.me/favicon/9elements.github.io/fancy-border-radius.png'
  name: FANCY-BORDER-RADIUS
  desc: 生成花里胡哨的Border圆角样式。
  link: https://9elements.github.io/fancy-border-radius/
  github: https://github.com/9elements/fancy-border-radius

- icon: 'https://api.liubing.me/favicon/cubic-bezier.com.png'
  name: 贝塞尔曲线
  desc: 拖拽方式生成贝塞尔曲线参数。
  link: https://cubic-bezier.com/

- icon: 'https://api.liubing.me/favicon/easings.net.png'
  name: 缓动函数速查表
  desc: 缓动函数速查表。
  link: https://easings.net/zh-cn
  github: https://github.com/ai/easings.net

- icon: 'https://api.liubing.me/favicon/grabient.com.png'
  name: Grabient
  desc: CSS 代码渐变颜色生成工具。
  link: https://grabient.com/
  github: https://github.com/johnkorzhuk/grabient

- icon: 'https://api.liubing.me/favicon/webgradients.com.png'
  name: Fresh Background Gradients
  desc: CSS 个性渐变背景集合。
  link: https://webgradients.com/
  github: https://github.com/itmeo/webgradients

- icon: 'https://api.liubing.me/favicon/whirl.netlify.app.png'
  name: Fresh Background Gradients
  desc: 创建各样的 CSS 加载动画。
  link: https://whirl.netlify.app/
  github: https://github.com/jh3y/whirl

- icon: 'https://api.liubing.me/favicon/codemyui.com.png'
  name: Codemyui
  desc: 非常酷的网站，有一堆很酷的 CSS、HTML 和 Javascript 片段。
  link: https://codemyui.com/

- icon: 'https://api.liubing.me/favicon/shadows.brumm.af.png'
  name: Smooth Shadow
  desc: 一款设置漂亮阴影的工具。
  link: https://shadows.brumm.af/

- icon: 'https://api.liubing.me/favicon/box-shadow.art.png'
  name: Box Shadow
  desc: 提供各种阴影样式。
  link: https://box-shadow.art/

- icon: 'https://api.liubing.me/favicon/colorhunt.co.png'
  name: Color Hunt
  desc: 非常受欢迎的配色网站，提供了大量的精选颜色方案。
  link: https://colorhunt.co/

- icon: 'https://api.liubing.me/favicon/glassgenerator.netlify.app.png'
  name: Glass Morphism
  desc: 在线CSS毛玻璃风格工具。
  link: https://glassgenerator.netlify.app/
  github: https://github.com/daniektj/Glass-Morphism-Generator

- icon: 'https://api.liubing.me/favicon/keyframes.app.png'
  name: Keyframes
  desc: 在线动画、阴影和颜色。
  link: https://keyframes.app/
  github: https://github.com/mitchas/keyframes

- icon: 'https://api.liubing.me/favicon/bgjar.com.png'
  name: BGJar
  desc: 一个免费的在线背景生成器，提供了各种类型和风格的背景图像。
  link: https://bgjar.com/

- icon: 'https://api.liubing.me/favicon/magicpattern.design.png'
  name: SVG Chart Generator
  desc: 一款设计精美的图表生成器，生成基于 SVG 的折线或条形格式的图表。
  link: https://magicpattern.design/tools/svg-chart-generator

- icon: 'https://api.liubing.me/favicon/css-generators.com.png'
  name: Ribbon Shapes
  desc: 一个纯 CSS 丝带的在线画廊。
  link: https://css-generators.com/ribbon-shapes/

- icon: 'https://api.liubing.me/favicon/css-generators.com.png'
  name: CSS Generators
  desc: CSS 生成器的一个小集合。
  link: https://css-generators.com/

- icon: 'https://api.liubing.me/favicon/venngage.com.png'
  name: Accessible Color Palette Generator
  desc: 一款调色板生成器。
  link: https://venngage.com/tools/accessible-color-palette-generator

Loading/动画

Animista

一个可自定义的 CSS 动画库工具

CSS Load

纯 CSS 生成各种 Loading 加载动画。

CSS Loaders

包含 30 多个类别下的 600 多个 CSS 加载动画。

- icon: 'https://api.liubing.me/favicon/animista.net.png'
  name: Animista
  desc: 一个可自定义的 CSS 动画库工具
  link: https://animista.net/

- icon: 'https://api.liubing.me/favicon/cssload.net.png'
  name: CSS Load
  desc: 纯 CSS 生成各种 Loading 加载动画。
  link: https://cssload.net/

- icon: 'https://api.liubing.me/favicon/css-loaders.com.png'
  name: CSS Loaders
  desc: 包含 30 多个类别下的 600 多个 CSS 加载动画。
  link: https://css-loaders.com/