扁平化设计的字体和配色

Eva Zhao | Created: Mar 28, 2014 Updated: Jul 24, 2024

扁平化设计是一种实打实的设计风格,不要花招,不要粉饰。扁平化之前,设计师的作品往往非常的写实,非常的有立体感。从整体的角度来讲,扁平化设计是一种极简主义美学,附以明亮柔和的色彩,最后配上粗重醒目,而风格又复古的字体,提倡功能大于形式、留白大于填充的美学。

扁平化设计是一种不使用任何额外效果的计方案,她不包括任何 3D 效果。这里没有很深的阴影,斜角,立体效果,渐变或者其它方法创建的凸出或者凹陷效果。图标和 UI 元素都是很鲜亮的,没有边缘效果和阴影。

扁平化设计并不是完全没有效果的,只是没有那些多余的人造的阴影和维度。现在越来越多的设计几乎都是扁平的了,他们的整体样子和观念都只包含很少的效果。

flat design.jpg

字体是排版中很重要的一部分,它需要和其他元素相辅相成,扁平化网站一般使用无衬线字体,符合扁平化中没有过多修饰的简约美。大部分扁平化设计最多使用两个系列的字体,很多只使用一个系列。

typography.png

Sans serif typefaces.jpg

Sans serif typefaces有统一的笔触宽度,是目前扁平化设计中比较受欢迎的字体。笔触的宽度不发生变化,因此看上去十分简洁,同时易于阅读。这种字体适用于很多背景,特别是那些扁平化的背景。字体描边加粗以后同样能够在色彩鲜艳的背景中呈现出很好的对比效果。

Serif typefaces也是一种选择,但是并不是经常被使用,因为这种字体看起来较为正式且包含了更多的装饰性元素。

选一种样式较多的字体,例如含有bold、 black和light等样式。这样即使只是用一种字体也可以呈现出充满层次感的丰富的视觉效果。

novelty typefaces是扁平化设计中另一种不错的字体选择。可以尝试一些新颖的字体,但是这种字体应该和sans serif具有相同的属性,例如清晰的线条和统一的笔触。避免过多的装饰性细节。

虽然在扁平化设计中经常只使用一种字体,但是如果有一种比较新颖的字体,选择两种字体也是不错的注意。当文本比较简单、字号比较大的时候可以使用较为新颖的字体,在字号较小,文本内容较多的区域使用另外一种字体。

以下是一些免费英文字体希望能给大家一些灵感。

Manteka字体

mnteka.jpg

Sintony – Free Google Web Font字体

sintony.jpg

Bellota字体

bellota.jpg

Corbert Regular字体

corbert regular.jpg

Frontage Typeface字体

frontage.jpg

ALEO | Free Font Family字体

aleo.jpg

GRAYSTROKE FREE FONT字体

graystroke.jpg

HEMIGRAPHY FREE FONT字体

hemigraphy.jpg

Laika FREE字体

lakia.jpg

SEAGLE FREE FONT字体

seagle.jpg

ALEX BRUSH字体

alexbrush.jpg

ALLER字体

aller.jpg

AMBLE字体

amble.jpg

CODE字体

code.jpg

EXO字体

exo.jpg

MUSEO SLAB字体

museo slab 1.jpg

QUICKSAND字体

quicksand.jpg

SINA NOVA字体

sina nova.jpg

SOFIA PRO字体

sofia pro.jpg

SOURCE SANS PRO字体

source sans pro.jpg

Free Langdon Font字体

free langdon.jpg

Linux Libertine字体

linux libertine.jpg

Museo Slab字体

museo slab 2.jpg

Nexa free font字体

nexa free font.jpg

Nougatine字体

nougatine.jpg

提到扁平化设计的色彩,纯色一定首当其冲地出现在我们脑海里,因为它带来了一种独特的感受。纯粹的亮色往往能够与明亮的或者灰暗的背景形成对比,以达到一种极富冲击力的视觉效果。所以说,在进行扁平化设计时,纯色绝对是非常受欢迎的色彩趋势。

flat design 2.jpgflat design 3.pngflat design 1.jpg

当然,扁平化设计并不局限于某种色彩基调,它可以使用任何色彩。

flat design 4.jpgflat design 5.jpgflat design 6.png

在进行扁平化设计时,复古色也是一种常见的色彩方式。

这种色彩虽然饱和度低,但却是在纯色的基础上添加白色,以使色彩变得更加柔和。复古色经常以大量的橘色和黄色为主,但有时也有红色或蓝色。

在扁平化设计中,以复古色为主色调是很常见的,以为这种色彩能够使页面变得更加柔美、富有女性气质。

flat design 7.jpgflat design 8.jpg

在扁平化设计中,同类色正迅速成长为一种流行趋势。这种色彩往往以单一颜色搭配黑色或白色来创造一种鲜明且有视觉冲击的效果。

关于作者

Dan Hu

Eva Zhao

联系我们 订阅电子报

Practical B2B Marketing Tips to 10X Better Marketing Results

Join 2,000+ professionals getting: Proven growth tactics, battle-tested strategies, and real B2B case studies.

Stephen Tseng
Stephen Tseng

为什么 B2B 企业的广告预算不断增加,高质量询盘却没有增长?

对于许多 B2B 企业来说,广告预算持续投入,网站访问量看起来也不错,但真正有价值的询盘却始终有限。问题往往不在于是否继续加预算,而在于广告是否吸引了正确的客户,以及点击之后是否形成有效转化。

继续阅读 →

Stephen Tseng
Stephen Tseng

海外品牌在中国卖不动,真的是中国市场太难了吗?

很多海外企业觉得“中国市场太难了”。在得出这个结论之前,先问一个问题:当中国客户产生采购需求时,他们能不能在百度上找到你?问题往往不是需求不足,而是品牌可见度不够。

继续阅读 →