6 个超棒的免费工具，帮你节省网站建设时间。（尤其适合“非设计师”开发者）

大家好，希望你们一切顺利！这篇短文介绍了6个免费工具，它们在我建站时帮我节省了大量时间。希望你们也能从中受益。让我们开始正文吧。

1.类型量表

您是否经常为元素的完美字体大小而苦恼？如果是，那么这款工具就是您的理想之选。

您所要做的就是添加基本字体大小，一旦这样做，此工具将为不同的元素生成不同的字体大小。（H1，H2，H3等）
此外，您可以从谷歌字体中选择不同的字体并尝试不同的字体大小比例。

此工具最棒的功能是，您可以直接复制根据您的选择生成的 CSS 并将其粘贴到您的 CSS 文件中。它还会导入您选择的字体并设置font-family for yourhtml 文件。这样，您就无需到处定义字体大小了！

如果您不了解如何将调色板应用到您的网页设计中，那么这是一个很好的起点。

该工具不仅展示了令人惊叹的调色板，而且还作为如何在设计项目中使用颜色的真实示例。

它展示了哪些元素应该使用哪些颜色，以及如何在插图中使用颜色，以便插图与您的设计相匹配。

此工具可生成可用于设计的字体对。您可以选择所需的对比度，然后点击“生成”，即可获得完美搭配的字体对。

CSS Peeper 是一款 Chrome 扩展程序，您可以用它来以井然有序、美观的方式检查不同网站的样式。它可以整理网站使用的颜色和字体。此外，如果您喜欢网页上的某个元素，还可以获取创建该元素所需的所有 CSS。

使用此工具，您可以生成精美的头像，用于您的设计。它提供多种样式供您选择，并支持导出 png、SVG 等不同格式的头像，还可以直接获取 React 代码或图片链接。全部免费！

使用此工具，您可以创建令人惊叹的盒状阴影。您可以为阴影添加多个图层，并调整每个部分，以创建令人惊叹的平滑阴影。

希望这篇文章对你有帮助。如果觉得有用，请分享，也可以在 Twitter 上关注我@devggaurav。

非常感谢你的阅读！😀