Designéři si zdarma SVG vzory pozadí z Hero vzory
Všechny moderní webové prohlížeče podporu SVG a jeho nejflexibilnější formát obrazu Můžeš použít. Ale navrhování vlastních SVG od nuly není snadný úkol.
Proto je to takový nástroj Hero vzory mohou být pro projektanty tak cenné. Je to bezplatná knihovna opakovatelné vzory SVG to můžeš přizpůsobit s různými styly, barvami a opacities.
Hero vzory mají dobře více než 40+ různých vzorů vybrat si a jsou všechny uvedeny přímo na domovské stránce. Když se posouváte dolů, uvidíte živá dema pro každou z nich a můžete kliknout na některého z nich, abyste viděli, jak vypadají.
V horní části stránky naleznete pevný pruh s nastavením změnit barvy popředí a pozadí. Barva pozadí se vztahuje na plochý povrch a barva popředí se vztahuje na v SVG.
Díky přírodní styl prolnutí, je těžké přijít se špatným barevným combo (i když určitě stále možné). Vzory se pohybují od dáma na podrobné opakující se ikony jako kotvy.
Když najdete vzor, který se vám líbí klikněte na tento blok pro modální okno s více podrobnostmi. Odtud můžete nastavit barvy popředí / pozadí, spolu s neprůhlednost popředí pro ikony.
Ale skutečné kouzlo se stane v poli s úryvkem kódu kde můžeš zkopírujte CSS pro vložení SVG čistě přes kód. V CSS existuje base64 ()
metodu převést data řetězce na data SVG. Tohle je poměrně běžné a pracuje také s jinými obrázky, jako jsou PNG.
Takže pokud nechcete, aby soubor SVG uložen lokálně, můžete jednoduše zkopírujte / vložte kód CSS přímo do vašeho stylu. Tohle bude vložit opakující se pozadí se správnými barvami přímo na vaše stránky. Jak cool!
Nebo, kdybyste raději upravovat SVG sami můžeš stáhnout kopii neupraveného obrazu SVG. Tímto způsobem můžete proveďte všechny úpravy ručně v designu softwaru jako Illustrator.
Hero vzory jsou jedním z mála nástrojů, které umožňují návrhářům převzít plnou kontrolu nad SVG přímo z prohlížeče. Opakující se pozadí se spoléhalo pouze na PNG, ale webové standardy postoupily dostatečně daleko SVG mohou zaujmout své místo.
Na začít, stačí navštívit domovskou stránku Hero Patterns a procházet jejich knihovnou vzorů. Nové vzory přidávejte často, tak se nezapomeňte zkontrolovat každou tak často.