LibraTool logoLibraTool

ነፃ የቦታ-ያዥ ምስል ፈጣሪ

ብጁ ልኬቶች፣ ጽሑፍና ቀለሞች ያላቸው ቀለም ያላቸው የቦታ-ያዥ ምስሎችን ይፍጠሩ። ለማህበራዊ ሚዲያ፣ mockupsና ንድፍ comps መደበኛ መጠኖች።

ቅድመ-ተዘጋጁ መጠኖች

የቀለም ገጽታዎች

💡 ለHTML ንድፎች፦ "Copy as data URL" የሚለውን ተጠቅመው ወደ <img src="..."> ውስጥ ይለጥፉ ለውስጣዊ የቦታ ያዢዎች። ለFigma / Sketch ንድፎች፣ PNGውን አውርደው ይጎትቱ።

እንዴት እንደሚሠራ

ሁሉም ነገር በአሳሽዎ ውስጥ የHTML Canvas APIን እና በእጅ የተጻፈ የSVG markupን በመጠቀም ይከናወናል — ምንም አገልጋይ፣ ምንም ስቀላ፣ ምንም የሦስተኛ ወገን አገልግሎት የለም። ልኬቶችን፣ ቀለሞችን እና የመለያ ጽሑፍን ያዘጋጃሉ፤ መሣሪያው ምስሉን በቀጥታ በሸራ አካል ላይ ይስላል፣ ከዚያም ሲጠየቅ ወደ PNG፣ JPEG ወይም SVG ይቀይረዋል።

  1. 1
    ልኬቶችን እና ቀለሞችን ያዋቅሩ
    ስፋት እና ቁመት ይተይቡ (እያንዳንዳቸው 1–4000 px)፣ ወይም የተለመዱ የማኅበራዊ ሚዲያ እና የንድፍ መጠኖችን ከሚሸፍኑ አሥራ አንድ ቅድመ-ቅንብሮች አንዱን ይምረጡ። ከአብሮገነብ ገጽታዎች የዳራ እና የጽሑፍ ቀለም ይምረጡ ወይም ማንኛውንም የhex እሴት በቀጥታ ያስገቡ፤ አብሮገነቡ ቀለም መራጭ እና የተረጋገጠው የጽሑፍ መስክ ተመሳስለው ይቆያሉ።
  2. 2
    Canvas API ቅድመ-እይታውን ወዲያውኑ ያሳያል
    የReact effect በእያንዳንዱ ለውጥ drawPlaceholder()ን ይጠራል። ይህ ተግባር CanvasRenderingContext2Dን በመጠቀም አራት ማዕዘኑን በዳራ ቀለሙ ይሞላል፣ በአማራጭ በ15% ግልጽነት ደብዛዛ ሰያፍ የመስቀል መስመሮችን ይስላል፣ ከዚያም የመለያ ጽሑፍዎን ይለካል እና በመሀል ያሰልፋል — ፊደሉ በሸራው ስፋት 90% ውስጥ እስኪገባ ድረስ በራስ-ሰር ይቀንሳል።
  3. 3
    እንደ PNG፣ JPEG ወይም SVG ያውጡ
    የPNG እና የJPEG ማውረዶች canvas.toDataURL()ን ይጠራሉ፣ የbase64 ውጤቱን በማህደረ ትውስታ ውስጥ ወደ Blob ይቀይራሉ፣ እና ማውረዱን ያስነሳሉ — የiOS Safari የማውረድ ሕጎች እንዲሟሉ ሁሉም በተጠቃሚው እርምጃ ውስጥ በቅጽበት ይከናወናሉ። የSVG ማውጣት ተዛማጅ rect፣ አማራጭ ሰያፍ መስመሮች እና የtext አካል ያለው ራሱን የቻለ የSVG ሕብረቁምፊ ይገነባል፣ ከዚያም እንደ .svg ፋይል ያስቀምጠዋል።
  4. 4
    በጅምላ ማውጣት እና የመቅዳት አቋራጮች
    «ሁሉንም ቅድመ-ቅንብሮች አውርድ» አዝራር JSZipን በተለዋዋጭ ያስገባል፣ ተመሳሳዩን የመሳያ ተግባር በመጠቀም አሥራ አንዱንም የቅድመ-ቅንብር መጠኖች ከማያ ገጽ ውጭ ባለ ሸራ ላይ እንደገና ይስላል፣ እና ሁሉንም PNGዎች ወደ አንድ ZIP ያሸጋል። የቅዳ አዝራሮች ወደ ኮድ ወዲያውኑ ለመለጠፍ የPNG data URL፣ የውስጥ SVG img መለያ ወይም የCSS background-image መግለጫ ያወጣሉ።

ተዛማጅ መሳሪያዎች

ተደጋጋሚ ጥያቄዎች