應援扇文字配色:遠距離也能一眼看清的顏色組合
應援扇文字首選深藍底×白字×黑邊框,遠距離仍清晰可讀。整理對比 3:1 以上的配色原則、淡色成員色與螢光色的正確用法,附具體色碼組合,可在 PixHub 編輯器用 50% 縮放邊試邊選。
應援扇子配色選擇時,不能只看背景色和文字色,邊框色也要一起算進這三層。會場 10 公尺以外還要看得清,關鍵是背景、文字、邊框的明暗差夠不夠。例如深藍底配白字,再加 3mm 黑邊框,燈光昏暗時輪廓還在。PixHub 內建 18 組先測過的配色(依 6 種成員色分組),弄懂對比之後也可以自己微調。這篇整理具體色碼、淺色與螢光成員色怎麼用,以及該避開的組合。
遠距離好不好讀,看的是明暗對比,不是顏色漂不漂亮。網頁無障礙常見的對比建議是文字與背景至少 3:1,小字最好 4.5:1 以上;應援扇在昏暗會場可以抓更高,7:1 以上比較穩。邊框在這裡很關鍵。背景和文字若太接近(淺紫底配淺紫字),加上深藍或黑色約 3mm 的邊框,才能把對比拉出來。寬度也有差:字高 6~8cm 時,2~3mm 剛好;1~1.5mm 太細,走遠就消失。在 PixHub 製作畫面同時調字高和邊框,用 50% 縮放看實際效果,對比不要低於 3:1。
成員色如果是淺色(淡粉、米色、淺紫),不要拿來當文字色,燈光下幾乎看不見。改當裝飾:(1) 白底上加一圈淺色細框;(2) 文字下方的強調細帶;(3) 深色文字內側加 1mm 淺色線。螢光色(螢光黃、霓虹粉、螢光青)很搶眼,但看久了會累,不適合當主文字。用法收在兩種地方:深色文字或深色背景的 2~3mm 邊框,或文字旁邊的強調線。例子:「淡薄荷」用白底加黑字,再加薄荷綠 2mm 邊框;「淡粉」用白底加深紫字,淡粉 1mm 內框再加深色 2mm 外框;「螢光黃」用灰底加黑字,再加螢光黃 2mm 邊框。PixHub 的調色盤會列出各成員色的建議組合,先從那裡開始再微調。
常見問題
哪種配色從遠處最好看清?
明度差大的組合最穩定。經典是深藍底(#003366)+白字(#FFFFFF)+黑邊框 2~3mm。白底(#FFFFFF)+深紫字(#3B1B5A)+黑邊框(#111111)也不挑場地。重點是拉開文字與背景的明度,並用邊框留下輪廓。在 PixHub 製作頁(/create)放上候選配色,用 50% 縮放確認能否一眼讀出再決定。
成員色是淺色怎麼辦?
淺色當文字色,在會場幾乎會消失。文字改用黑(#111111)或深藍(#102A43)等深色,成員色留給邊框或細線點綴。例如淡粉(#FFB6D9)用白底+黑字+粉邊框 2mm;薄荷綠(#BFE9D3)用白底+深藍字+薄荷邊框 2mm。在製作頁(/create)只替換邊框色來比較,比較好決定。
邊框該用什麼顏色?
邊框要選與文字、背景明度都拉開的顏色。白字用黑或深藍 2~3mm;黑字用白,或成員色 1.5~2mm。例如:(A) 白底+深藍字+黑邊框 3mm;(B) 深紫底+白字+深藍邊框 3mm;(C) 奶油底+黑字+電光粉邊框 1.5mm。拿不定時先用黑或白邊框保住輪廓,再補上應援色。
哪些配色該避開?
要避開明度接近的組合。淡黃字配白底、淡粉配奶油底、深藍字配深紫底、黑配深灰,遠看會融在一起。色相接近的淡藍配淡綠、紅配橘也一樣。對比已經弱、邊框又細或沒有,更危險。螢光色鋪滿整段文字,或混用五色以上,也會變難讀。手機上看得出來、會場卻垮掉的例子是深紅(#8B0000)配深紫(#4B0082)。製作頁(/create)用 50% 縮放仍讀不出來,就視為 10 公尺外也讀不出來,重新選色。
可以用螢光色嗎?
可以用,但不適合當文字色或整面背景。白或淺灰底放黑字,再用螢光黃(#FFFF00)或電光粉(#FF1493)做 1.5~2mm 邊框,比較能兼顧搶眼與可讀。螢光青(#00FFFF)適合細的點綴線。成員色即使是螢光,也限定在邊框或一小段強調色。在製作頁(/create)只把邊框改成螢光,用 50% 縮放確認不會刺眼再採用。