相關(guān)推薦
您可能對(duì)下面課程感興趣
Figma之UIUX項(xiàng)目交互教程

55小節(jié)已有1551人學(xué)過

UI設(shè)計(jì)之Figma系列教程

120小節(jié)已有20622人學(xué)過

Figma如何新建畫布 Figma如何改背景顏色
發(fā)布時(shí)間:2025-01-23 14:59 [ 我要自學(xué)網(wǎng)原創(chuàng) ] 發(fā)布人: 快樂小女 閱讀: 100

UI設(shè)計(jì)工具Figma除了出色的圖片編輯與AI協(xié)作功能,還有強(qiáng)大的基礎(chǔ)繪圖設(shè)計(jì)功能,將這些功能的交互使用,能夠快速激發(fā)個(gè)人潛力,讓用戶成為更加出色的設(shè)計(jì)師。本篇文章從基礎(chǔ)的畫布與顏色功能開始認(rèn)識(shí)Figma,下面就告訴大家Figma如何新建畫布,F(xiàn)igma如何改背景顏色。

一、Figma如何新建畫布

大家設(shè)計(jì)的圖形稿件都需要適應(yīng)手機(jī)或者電腦屏幕的畫幅大小,由于未新建畫布時(shí),直接在Figma設(shè)計(jì)框中作圖,無法控制畫布大小,因此,在繪制設(shè)計(jì)稿前新建一個(gè)畫布,可以提前規(guī)劃設(shè)計(jì)稿的長(zhǎng)寬數(shù)值大小,以免過大或過小影響在屏幕中的展示效果。下面就向大家演示一下如何在Figma中新建畫布。

1、首先如圖1所示,打開谷歌瀏覽器,在瀏覽器中中登陸Figma。


圖1:登陸Figma

2、在新建畫布之前,需要新建一個(gè)設(shè)計(jì)文件。登陸Figma后,在Figma功能菜單中找到“文件”,點(diǎn)擊“文件”中的“新建設(shè)計(jì)文件”,新建一個(gè)設(shè)計(jì)文件。


圖2:新建設(shè)計(jì)文件

3、隨后如圖3所示,新設(shè)計(jì)文件頁(yè)面中沒有明確的畫布也就是畫框范圍,在頁(yè)面下方點(diǎn)擊

“畫框”功能,然后拖動(dòng)鼠標(biāo)在空白區(qū)域畫出一個(gè)方形畫框,這樣,一個(gè)753×513大小的畫布就建好了。


圖3:新建畫布

4、上文新建的畫布大小不夠合適,如果想精確控制畫布大小,那么如圖4所示,在頁(yè)面右側(cè)的畫布長(zhǎng)寬中修改畫布長(zhǎng)寬數(shù)值,例如將數(shù)值修改為600×600,這時(shí)畫布就改為600×600大小了。


圖4:修改畫布大小

二、Figma如何改背景顏色

Figma背景色除了表示畫布背景色,還表示紙張背景色,紙張即新建設(shè)計(jì)文件的整體內(nèi)容。上文介紹了怎么在Figma中新建畫布,畫布中的白色為默認(rèn)的白色畫布背景色,畫布之外的紙張顏色也是默認(rèn)的白色,那么將白色背景色修改為其他背景顏色該怎么做呢?

1、首先修改畫布背景色,如圖5所示,點(diǎn)擊畫布頁(yè)面右側(cè)“填充”中的小色塊,調(diào)出色框頁(yè)面,然后在色框中選中一個(gè)顏色,這樣畫布背景色就修改好了。


圖5:修改畫布背景色

2、如果不想取用色框中的顏色,那么可以使用取色器對(duì)設(shè)計(jì)文件中的其他部分進(jìn)行取色。如圖6紅框中所示,點(diǎn)擊取色框中的取色器,然后拖動(dòng)取色器至需要的顏色處點(diǎn)擊一下,畫布背景色就修改為指定顏色了。


圖6:使用取色器修改背景色

3、修改了畫布背景色,接下來嘗試修改紙張背景色,即整個(gè)設(shè)計(jì)工作區(qū)背景色。如圖7所示,點(diǎn)擊畫布外的區(qū)域,即可選中整個(gè)紙張范圍,然后點(diǎn)擊“page”下方的小色塊,在彈出的色框中選擇需要修改的背景色,整個(gè)紙張的背景色就由白色修改為紅色了,到此Figma改背景色的詳細(xì)教程就演示完了。


圖7:修改紙張背景色

三、小結(jié)

以上就是Figma如何新建畫布,F(xiàn)igma如何改背景顏色的相關(guān)教程。Figma需要在新建設(shè)計(jì)文件中設(shè)定畫框來新建畫布,同時(shí),在畫布填充功能中能夠修改畫布背景色,在“page”顏色區(qū)能夠修改紙張背景色,快來按上文步驟試試吧!

文章評(píng)論
0 條評(píng)論 按熱度排序 按時(shí)間排序 /350
添加表情
遵守中華人民共和國(guó)的各項(xiàng)道德法規(guī),
承擔(dān)因您的行為而導(dǎo)致的法律責(zé)任,
本站有權(quán)保留或刪除有爭(zhēng)議評(píng)論。
參與本評(píng)論即表明您已經(jīng)閱讀并接受
上述條款。
V
特惠充值
聯(lián)系客服
APP下載
官方微信
返回頂部
相關(guān)推薦
您可能對(duì)下面課程感興趣
Figma之UIUX項(xiàng)目交互教程

55小節(jié)已有1551人學(xué)過

UI設(shè)計(jì)之Figma系列教程

120小節(jié)已有20622人學(xué)過

分類選擇:
電腦辦公 平面設(shè)計(jì) 室內(nèi)設(shè)計(jì) 室外設(shè)計(jì) 機(jī)械設(shè)計(jì) 工業(yè)自動(dòng)化 影視動(dòng)畫 程序開發(fā) 網(wǎng)頁(yè)設(shè)計(jì) 會(huì)計(jì)課程 興趣成長(zhǎng) AIGC