首页 web前端 css教程 重新'非人工智能”设计工具来创建人类喜爱的登陆页面

重新'非人工智能”设计工具来创建人类喜爱的登陆页面

Dec 30, 2024 pm 09:21 PM

大约一周前,我必须为网络开发人员的免费密码学课程构建一个登陆页面。当我开始构建它时,我一路收集了一些工具。

这些工具极大地帮助我使登陆页面比我所能构建的更加漂亮。

这些工具让我思考——为什么我不早点知道它们!

需要明确的是:我与这些工具中的任何一个都没有任何商业关系。我只是爱他们,我知道你也会的。这就是我与大家分享的原因。

此列表中提到的所有工具都是完全免费,没有广告并且没有付费专区。我想说,它们实际上是免费的黄金。


1.SVG 仓库

该网站拥有大量 SVG 矢量图形和图标。我喜欢他们的无广告且简单的设计。没有付费墙。所有 SVG 图形都是完全免费的。您可以将这些 SVG 用作图标或其他图形。

ree

这个网站也有一个 SVG 编辑器。我发现它对于更改 SVG 的颜色以匹配我的登陆页面的调色板非常有帮助。

➡️ 看看:SVG Repo


2.Excalidraw

这是一个非常流行的绘图工具。对我来说,闪电般的时刻是当我发现 Excalidraw 库时。 exalidraw 库包含社区预先制作的图形。这有助于快速创建看起来很酷的图形和图表。

例如,我使用 excalidraw 库中的一些预制图形为我的课程登陆页面创建了以下图形。我只花了大约 10 分钟就完成了这一切。如果没有 exalidraw 库,执行它会花费很多时间。

ree

➡️ 看看:Excalidraw


3.海溪

这是一个设计精良的工具。它允许您创建 SVG 设计。您可以使用这些设计作为着陆页部分或产品内部的背景。

ree

我使用此工具为我的着陆页过去的工作部分创建背景:

ree

➡️看看:海基


4. unDraw手工艺品

ree

此工具有大量手绘 SVG 图形,可用于突出显示着陆页中的部分标题。这些手绘图形非常令人愉悦,您会发现它在各种情况下都有用。

我从这个网站下载了一个手绘火箭并将其放在我的登陆页面的“关于”部分:

ree

➡️看看:unDraw Handcrafts


5. 英雄模式

我一直想知道那些 SVG 图案背景是从哪里来的。当我发现英雄图案时,我惊呆了。

英雄图案有很多SVG背景图案。该网站允许您选择正确的颜色,然后您只需复制并粘贴 CSS 片段即可。

我使用此工具为我的课程登陆页面的课程部分创建了方格纸类型的背景:

ree

➡️看看:英雄模式


我从 Marc Lou 的 ShipFast 文档中找到的最后三个工具。他是一位鼓舞人心的产品构建者!

你应该在 Twitter 上关注我。我尝试把有用的东西放在那里。我会尊重你的时间。

感谢您的阅读!

-vkweb

以上是重新'非人工智能”设计工具来创建人类喜爱的登陆页面的详细内容。更多信息请关注PHP中文网其他相关文章!

本站声明
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系admin@php.cn

热AI工具

Undresser.AI Undress

Undresser.AI Undress

人工智能驱动的应用程序,用于创建逼真的裸体照片

AI Clothes Remover

AI Clothes Remover

用于从照片中去除衣服的在线人工智能工具。

Undress AI Tool

Undress AI Tool

免费脱衣服图片

Clothoff.io

Clothoff.io

AI脱衣机

Video Face Swap

Video Face Swap

使用我们完全免费的人工智能换脸工具轻松在任何视频中换脸!

热工具

记事本++7.3.1

记事本++7.3.1

好用且免费的代码编辑器

SublimeText3汉化版

SublimeText3汉化版

中文版,非常好用

禅工作室 13.0.1

禅工作室 13.0.1

功能强大的PHP集成开发环境

Dreamweaver CS6

Dreamweaver CS6

视觉化网页开发工具

SublimeText3 Mac版

SublimeText3 Mac版

神级代码编辑软件(SublimeText3)

热门话题

Java教程
1653
14
CakePHP 教程
1413
52
Laravel 教程
1304
25
PHP教程
1251
29
C# 教程
1224
24
带有粘性定位的堆叠卡和一点点的杂物 带有粘性定位的堆叠卡和一点点的杂物 Apr 03, 2025 am 10:30 AM

前几天,我发现了科里·金尼文(Corey Ginnivan)网站上的这一点,当您滚动时,彼此之间的卡片堆放集。

Google字体可变字体 Google字体可变字体 Apr 09, 2025 am 10:42 AM

我看到Google字体推出了新设计(Tweet)。与上一次大型重新设计相比,这感觉更加迭代。我几乎无法分辨出区别

如何使用HTML,CSS和JavaScript创建动画倒计时计时器 如何使用HTML,CSS和JavaScript创建动画倒计时计时器 Apr 11, 2025 am 11:29 AM

您是否曾经在项目上需要一个倒计时计时器?对于这样的东西,可以自然访问插件,但实际上更多

HTML数据属性指南 HTML数据属性指南 Apr 11, 2025 am 11:50 AM

您想了解的有关HTML,CSS和JavaScript中数据属性的所有信息。

为什么Flex布局中的紫色斜线区域会被误认为是'溢出空间”? 为什么Flex布局中的紫色斜线区域会被误认为是'溢出空间”? Apr 05, 2025 pm 05:51 PM

关于Flex布局中紫色斜线区域的疑问在使用Flex布局时,你可能会遇到一些令人困惑的现象,比如在开发者工具(d...

如何通过CSS选择第一个类名为item的子元素? 如何通过CSS选择第一个类名为item的子元素? Apr 05, 2025 pm 11:24 PM

在元素个数不固定的情况下如何通过CSS选择第一个指定类名的子元素在处理HTML结构时,常常会遇到元素个数不�...

使Sass更快的概念证明 使Sass更快的概念证明 Apr 16, 2025 am 10:38 AM

在一个新项目开始时,Sass汇编发生在眼睛的眨眼中。感觉很棒,尤其是当它与browsersync配对时,它重新加载

在前端开发中,如何使用CSS和JavaScript实现类似Windows 10设置界面的探照灯效果? 在前端开发中,如何使用CSS和JavaScript实现类似Windows 10设置界面的探照灯效果? Apr 05, 2025 pm 10:21 PM

在前端开发中如何实现类似Windows...

See all articles