a11y.skipToMainContent
1

ตัวจําลองรูปแบบ SVG

จง สร้าง แบบ จําลอง แบบ สวี จี ซ้ํา ๆ — ให้ เลือก จาก ชนิด แบบ 8 ชนิด, แต่ง สี และ ช่องว่าง. ดาวน์โหลดเป็นพื้นหลังแบบ SVG หรือคัดลอกเป็นพื้นหลัง CSS.

Preview

SVG Code

CSS Background

Was this tool helpful?
Send Image to:
Advertisement

How to use SVG Pattern Generator

  1. เลือกประเภทของรูปแบบจากกล่องวาง.
  2. ปรับสีพื้นหลัง, สีรูปแบบ, ช่องว่าง, และสัดส่วนภาพ.
  3. คัดลอกรหัสพื้นหลัง CSS หรือดาวน์โหลดแฟ้ม SVG.

อะไรคือ?

ปรับปรุงรูปแบบพื้นหลัง เพิ่มความสนใจภาพไปยังเว็บไซต์ นําเสนอและออกแบบ เครื่องมือนี้สร้างรูปแบบ SVG ที่สะอาดซึ่งปูกระเบื้องอย่างไม่มีที่ติ -- เลือกจากจุดโพลีกาลายลายลาย, รูปหกเหลี่ยม, ไม้ไขว้, คลื่น, ตาราง และสามเหลี่ยม ปรับแต่งสีพื้นหลัง, สีรูปแบบ, ช่องว่าง, ขนาด และค่าความทึบแสง เครื่องมือนี้ส่งออกเสียงได้ทั้งรหัส SVG ดิบ และประกาศพื้นหลังแบบ CSS ซึ่งมี URI ของข้อมูลอยู่ในบรรทัด — ไม่มีแฟ้มภายนอกที่ต้องการ (* p)

Advertisement

FAQ

รูป แบบ ต่าง ๆ ไม่ เป็น ที่ ยอม รับ จริง ๆ ไหม?
ใช่ — แต่ละ SVG ถูกออกแบบมาเพื่อกระเบื้องได้อย่างสมบูรณ์แบบ โดยใช้พื้นหลังแบบ CSS สําหรับรูปแบบแบบไม่ต่อเนื่อง.
ฉันจะใช้ผลของ CSS อย่างไร?
CSS ที่สร้างมานั้น มีภาพพื้นหลังแบบ URI ข้อมูล ซึ่งคุณสามารถวางโดยตรงลงในสไตล์ชีตของคุณได้ โดยไม่ต้องแยกแฟ้มอิมเมจออกจากกัน.

Related tools

Author

AR
Aisha Rahmani"The Visual Storyteller"

Design Technologist & Media Specialist

Aisha bridges the gap between pixels and code. With expertise in image processing, SVG optimization, and video compression, she helps creators, designers, and marketers prepare media that looks great and loads fast. She has spoken at design conferences about accessible visual content and has helped agencies reduce page-weight budgets by up to 60 percent without sacrificing creative quality.

📖 SVG Pattern Generator on Wikipedia·Image Tools on Wikipedia·SVG Pattern Generator on Britannica

People also use

← Back to Image Tools · All tags
Advertisement