Ġeneratur ta' Immaġni Placeholder b'xejn
Iġġenera immaġni placeholder bil-kulur b'dimensjonijiet customizzati, test, u kuluri. Daqsijiet standard għal midja soċjali, mockups, u comps tad-disinn.
Daqsijiet preset
Temi tal-kulur
💡 Għal mockups HTML: uża l-għażla 'Ikkopja bħala data URL' u waħħalha f'<img src="..."> għal placeholders inline. Għal disinjati Figma / Sketch, niżżel il-PNG u daħħalha ġewwa.
Użi komuni
- Immaġini Placeholder għall-Mockups tad-DisinnIġġenera boksi kkuluriti ta' qagħda għall-użu f'Figma, Sketch, jew mockups ta' disinn web qabel ma jkunu rritratti reali.
- Placeholders Inline għall-HTML PrototypesUża 'Copy as data URL' biex inline placeholder images direttament f'HTML għal fast prototypes.
- Placeholders għall-CMS Content SlotsMeta ti-demo template CMS, uża placeholder images ins ma' real content għal previews sensittivi.
- Social Media Image TemplatesIġġenera placeholders korretti tal-qagħda għal Instagram, Facebook, Twitter, LinkedIn post templates.
- CSS Layout Testing ImagesIġġenera immaġini f'aspect ratios estremi biex stress-test responsive CSS layouts.
Kif Taħdem
Kollox iseħħ fil-browser tiegħek bl-użu tal-API HTML Canvas u markup SVG miktub bl-idejn — l-ebda server, l-ebda tela', l-ebda servizz ta' parti terza. Issettja dimensjonijiet, kuluri, u test tat-tikketta, u l-għodda tpittar l-istampa direttament fuq element canvas f'ħin reali, imbagħad tisserjalizzaha għal PNG, JPEG, jew SVG fuq talba.
- 1Ikkonfigura dimensjonijiet u kuluriIttajpja wisa' u għoli (1–4000 px kull wieħed), jew agħżel wieħed minn ħdax-il preset li jkopru daqsijiet komuni tal-midja soċjali u tad-disinn. Agħżel kulur tal-isfond u tat-test mit-temi inkorporati jew daħħal kwalunkwe valur hex direttament; għażla ta' kulur nattiva u qasam tat-test ivvalidat jibqgħu sinkronizzati.
- 2L-API Canvas tirrendja l-anteprima minnufihEffett ta' React isejjaħ drawPlaceholder() f'kull bidla. Din il-funzjoni tuża CanvasRenderingContext2D biex timla r-rettangolu bil-kulur tal-isfond, mhux obbligatorjament tiddisinja linji dijagonali dgħajfa fuq 15% opaċità, imbagħad tkejjel u tallinja fiċ-ċentru t-test tat-tikketta tiegħek — awtomatikament tnaqqas il-font sakemm jidħol f'90% tal-wisa' tal-canvas.
- 3Esporta bħala PNG, JPEG, jew SVGIt-tniżżil ta' PNG u JPEG isejjaħ canvas.toDataURL(), jikkonverti r-riżultat base64 f'Blob fil-memorja, u jitfa' t-tniżżil — kollox sinkronament ġewwa l-ġest tal-utent biex ir-regoli tat-tniżżil tal-Safari tal-iOS jiġu sodisfatti. L-esportazzjoni SVG tibni string SVG awtonomu b'rettangolu li jaqbel, linji dijagonali mhux obbligatorji, u element tat-test, imbagħad issejvjah bħala fajl .svg.
- 4Esportazzjoni b'lott u shortcuts tal-kopjaIl-buttuna 'Niżżel il-presets kollha' timporta dinamikament JSZip, terġa' tirrendja kull wieħed mill-ħdax-il daqs preset fuq canvas barra l-iskrin bl-użu tal-istess funzjoni tad-disinn, u tippakkja l-PNGs kollha f'ZIP wieħed. Buttuni tal-kopja joħorġu data URL PNG, tag SVG img inline, jew dikjarazzjoni CSS background-image għal waħħil immedjat fil-kodiċi.
Għodod Relatati
Ġeneratur ta' Lorem Ipsum
Iġġenera test placeholder Lorem Ipsum. Agħżel kliem, sentenzi, jew paragrafi. Ikkopja b'klikk wieħed.
Kumpressur tal-Immaġni
Ikkompressa immaġini JPG, PNG, WebP, u AVIF. Ara paragun qabel/wara.
Ridimensjonatur tal-Immaġni
Ridimensjona l-immaġini skont id-dimensjonijiet jew il-perċentwali. Żomm il-proporzjon tal-aspett, agħżel il-format tal-output, mingħajr telf ta' kwalità.