ข้ามไปยังเครื่องมือ
JoeLucky

กด ★ ที่เครื่องมือเพื่อบันทึก

หมวดหมู่เครื่องมือ

แปลงโค้ดเป็นรูปภาพสร้างไล่สี CSSGlassmorphism CSSสร้าง Box Shadowสร้าง CSS Loaderสร้าง SVG BlobSVG เป็น PNGตรวจความต่างสีแปลง PX / REM / EM
JoeLucky

เครื่องมือออนไลน์ที่ใช้งานได้จริง รวมไว้ในที่เดียว

นโยบายความเป็นส่วนตัวข้อกำหนดการให้บริการ

© 2026 JoeLucky®. สงวนลิขสิทธิ์

  1. JoeLucky
  2. /CSS และการออกแบบ
  3. /สร้าง SVG Blob

สร้าง SVG Blob

สร้างรูปทรงอิสระแบบ SVG พร้อมปรับความซับซ้อนได้

การตั้งค่ารูปทรง

ความซับซ้อน (จำนวนจุด)6
ความสุ่ม50
สีเติม
แอนิเมชัน CSS
ตัวอย่างสด
ส่งออก

CSS และการออกแบบ ที่คล้ายกัน

ดูทั้งหมด
แปลงโค้ดเป็นรูปภาพ

เปลี่ยนโค้ดสั้น ๆ ให้เป็นภาพหน้าจอที่สวยงาม

เปิด →
สร้างไล่สี CSS

ออกแบบไล่สีแบบเส้นตรง วงกลม และกรวยด้วยภาพ แล้วคัดลอก CSS ได้ทันที

เปิด →
Glassmorphism CSS

💬 ความคิดเห็น

?

ยังไม่มีความคิดเห็น มาเป็นคนแรกกันเลย!

สร้าง SVG Blob คืออะไร?

สร้างรูปทรง blob SVG แบบออร์แกนิกแบบสุ่ม ปรับความซับซ้อน ความสุ่ม และการเติมสีได้ — เหมาะกับตกแต่งพื้นหลังหรืองานภาพประกอบ — และคัดลอก SVG หรือ clip-path

วิธีใช้

  1. “ความซับซ้อน” (3–10) กำหนดจำนวนจุด ยิ่งสูงยิ่งละเอียด “ความสุ่ม” ควบคุมว่าจุดเบี่ยงเบนจากวงกลมสมบูรณ์มากเพียงใด — 0 เกือบกลม 100 ไม่เป็นระเบียบที่สุด
  2. คลิกวงกลมสี 6 วงเพื่อเลือกกราเดียนต์ (ม่วง กุหลาบ ฟ้าเขียว อำพัน ชมพู) หรือสีทึบ — ตัวอย่างอัปเดตทันที
  3. เลือกจากแอนิเมชัน CSS 5 แบบ (ไม่มี Pulse Float Wobble Spin) SVG ที่ส่งออกจะฝังโค้ด @keyframes ที่เกี่ยวข้องโดยอัตโนมัติ
  4. คลิก “สุ่ม” เพื่อข้ามไปยังรูปทรงใหม่ทันที เมื่อพบรูปทรงที่ชอบ ปรับความซับซ้อนและความสุ่มอย่างละเอียดเพื่อขัดเกลา
  5. ตัวเลือกส่งออกสี่แบบ: “คัดลอก SVG” สำหรับมาร์กอัปครบถ้วน “คัดลอก clip-path” สำหรับการมาสก์ด้วย CSS ดาวน์โหลดเป็นเวกเตอร์ SVG หรือเป็น PNG 800×800px

คำถามที่พบบ่อย

ตัวสร้าง SVG Blob คืออะไร?

สร้างกราฟิก SVG รูปทรงก้อนอินทรีย์ที่เรียบเนียน ปรับสี ความซับซ้อน และความสุ่มได้

นำ SVG ไปใช้ที่ไหนได้?

ฝังใน HTML/CSS หรือดาวน์โหลดแล้วนำเข้า Figma, Illustrator ฯลฯ

คลิกแต่ละครั้งได้รูปทรงต่างกันไหม?

ได้ การคลิกสร้างใหม่แต่ละครั้งให้รูปทรงบลอบสุ่มที่ไม่ซ้ำกัน

สร้างโค้ดเบลอพื้นหลังและขอบโปร่งแสงแบบเรียลไทม์

เปิด →