Utilia

Generátor zástupných obrázků

Vytvoř zástupné obrázky libovolné velikosti s vlastními barvami a textem jako PNG, JPG, WebP nebo SVG, případně ZIP s běžnými velikostmi bannerů. Zdarma.

Formát

Dávka běžných velikostí

Použije barvy, text a formát uvedené výše. Při prázdném textu se u každého obrázku zobrazí jeho velikost.

Jak vytvořit zástupný obrázek

  1. Zadej Šířku (px) a Výšku (px) od 1 do 10 000 pixelů. Náhled i poměr stran se aktualizují při psaní.
  2. Napiš Text, nebo ho nech prázdný, aby se vypsala velikost, například „1200×630“.
  3. Vyber Barvu pozadí a Barvu textu.
  4. Nech Velikost písma (px) na 0 pro automatickou velikost, která se do obrázku vejde, nebo zadej velikost v pixelech. Vyber Písmo.
  5. Zvol Formát: PNG, JPG, WebP nebo SVG a klikni na Stáhnout obrázek.

Chceš-li vytvořit více velikostí najednou, otevři Dávku běžných velikostí, zaškrtni potřebné velikosti (nebo použij Vybrat vše / Zrušit výběr) a klikni na Stáhnout vybrané velikosti (ZIP). Každý obrázek používá výše nastavené barvy, písmo a formát; když je text prázdný, zobrazí každý obrázek svou vlastní velikost.

Který formát zvolit

  • SVG je nejlehčí (několik set bajtů bez ohledu na velikost) a zůstává ostré při jakémkoli zvětšení. Je ideální pro makety, prototypy a šablony HTML. Text používá systémové písmo, takže jeho vzhled se může mezi počítači mírně lišit.
  • PNG dává přesné bezztrátové pixely. Vyber ho pro návrhářské nástroje a tam, kde je potřeba skutečná bitmapa.
  • JPG vytváří malé soubory i pro velké rozměry a přijímá ho všechno, včetně starých redakčních systémů.
  • WebP je menší než PNG a JPG a podporují ho všechny současné prohlížeče.

Rastrové formáty jsou omezeny na zhruba 16,7 milionu pixelů (například 4096 × 4096), což je největší plátno, které prohlížeče dokážou zakódovat. SVG takový limit nemá.

Běžné velikosti v dávce

Velikost Použití
150 × 150 Miniatura, avatar
300 × 250 Reklama – střední obdélník
728 × 90 Reklama – leaderboard
160 × 600 Reklama – široký mrakodrap
320 × 50 Mobilní banner
1200 × 630 Open Graph / náhled odkazu
1080 × 1080 Čtvercový příspěvek
1080 × 1920 Story / vertikální video
1280 × 720 Video HD, 16:9
1920 × 1080 Full HD, 16:9
800 × 600 Obrázek 4:3
1600 × 500 Hlavní banner webu

Reklamní velikosti odpovídají standardním jednotkám IAB, které používá většina reklamních sítí; velikosti pro sociální sítě odpovídají doporučením hlavních platforem.

Proč používat zástupné obrázky

Zástupné obrázky rezervují přesné místo, které zabere skutečný obrázek, ještě než existuje. Návrháři a vývojáři tak mohou zkontrolovat rozvržení, otestovat responzivní zlomové body nebo ukázat zákazníkovi, kam půjdou vizuály, aniž by museli hledat stockové fotky. Rozměry vypsané na obrázku jasně ukazují, jakou velikost každé místo očekává, a neutrální šedá udržuje pozornost na rozvržení, ne na obsahu.

Protože tento nástroj vytváří skutečné soubory, můžeš je používat offline, ukládat do repozitáře nebo vkládat do návrhářského nástroje, bez závislosti na externí službě pro zástupné obrázky, která může přestat fungovat nebo sledovat návštěvníky.

Časté dotazy

Jak získat zástupný obrázek bez textu?

Napiš do pole Text jednu mezeru. Obrázek bude jednoduchý obdélník v barvě pozadí.

Můžu tyto obrázky použít v komerčních projektech?

Ano. Obrázky se vytvářejí na tvém zařízení podle tvého vlastního nastavení; není co licencovat ani uvádět.

Co znamená „×“ ve výchozím textu?

Je to znak násobení, kterým se zapisují rozměry, nejdřív šířka: „1200×630“ znamená 1200 pixelů na šířku a 630 pixelů na výšku.

Proč se automatická velikost písma mění podle textu?

Velikost se počítá tak, aby text zabíral zhruba 80 % šířky a nepřesáhl 30 % výšky. Krátký text na širokém banneru je omezen výškou; dlouhý text na úzkém obrázku šířkou.

Nahrává se něco na server?

Ne. Obrázky i soubor ZIP se vytvářejí výhradně ve tvém prohlížeči.