วิธีแยกสี SVG เป็นไฟล์แต่ละสี

การแยกสี SVG เป็นไฟล์แต่ละสี ให้จัดกลุ่มรูปทรงตามค่าสีเติมที่ตรงกัน แล้วส่งออกแต่ละกลุ่มบน อาร์ตบอร์ดเต็มขนาดเดียวกับต้นฉบับ อย่าครอปแต่ละสีให้พอดีกับขอบเขตของตัวเอง พื้นที่ว่างช่วยให้ชิ้นส่วนตรงตำแหน่งเมื่อนำเข้า ตัด สกรีน หรือประกอบกลับ

สำหรับ SVG สีเติมทึบที่รองรับ SVG Color Separator ฟรีของ PerfectVector ทำขั้นตอนนี้ภายในเบราว์เซอร์ของคุณ สำหรับงานซับซ้อน เลือกวัตถุตามสีเติมในโปรแกรมเวกเตอร์แล้วส่งออกแต่ละสีด้วยมือได้

กฎแยกสีอย่างปลอดภัย

• ทำสำเนา SVG ต้นฉบับที่ไม่แก้ไขไว้
• ตัดสินใจว่าจะรวมสีเกือบซ้ำหรือไม่ ก่อน แยก
• จัดกลุ่มตามค่าสีเติมตรงกัน อย่ามองการไล่สี ลวดลาย หรือภาพเป็นสีธรรมดา
• เก็บความกว้าง ความสูง และ viewBox ต้นฉบับในทุกผลลัพธ์
• รักษาตำแหน่งเดิมของแต่ละรูปทรงและลำดับการระบายของวัตถุสีเดียวกัน
• นำไฟล์ทั้งหมดเข้าร่วมกัน แล้วตรวจขนาดและการตรงตำแหน่งก่อนตัดวัสดุ

เหตุใดไฟล์แต่ละสีควรเก็บอาร์ตบอร์ดเต็ม

นึกถึงดอกไม้ที่มีกลีบฟ้าใกล้มุมซ้ายบนและกลีบแดงใกล้มุมขวาล่าง หากครอปทั้งสองไฟล์ให้พอดี กลีบแต่ละกลีบจะย้ายไปมุมซ้ายบนของเอกสารใหม่ SVG ทั้งคู่จึงไม่ใช้ระบบพิกัดร่วมกันอีก และการประกอบกลับต้องคาดเดา

เมื่อทุกไฟล์คงอาร์ตบอร์ดเดิม แต่ละสีจะอยู่ที่พิกัดที่ควรอยู่ ไฟล์สีฟ้าอย่างเดียวอาจมีพื้นที่ว่างมาก นี่คือข้อมูลการจัดตำแหน่งที่ตั้งใจ ไม่ใช่พื้นที่เสียเปล่า

แนวคิดพื้นที่ทำงานร่วมกัน

viewBox ของ SVG กำหนดพื้นที่พิกัดภายใน รักษาค่านี้พร้อมความกว้างและความสูงจริงที่เชื่อถือได้เมื่อเครื่องตัด ร้านพิมพ์ หรือคู่ค้าผลิตให้ความสำคัญกับขนาดจริง

ค่าสีตรงกันไม่เหมือนสีที่มองเห็นคล้ายกัน

SVG อาจมี #ff0000 กับ #fe0000 ดูเกือบเหมือนกัน แต่เป็นค่าสองค่าและจะได้สองไฟล์เมื่อแยกตามค่าสีตรงกัน วิธีนี้ปลอดภัยกว่าการเดาเงียบ ๆ ว่านักออกแบบตั้งใจให้เป็นสีผลิตเดียวกัน

ก่อนแยก ให้ตรวจชุดสี:

เวิร์กโฟลว์ลดชุดสี อธิบายการรวมสีใกล้เคียงตามบทบาททางภาพและการผลิต ตัดสินใจเรื่องนี้ก่อน เครื่องมือแยกสีไม่ควรตัดสินแทน

วิธีที่ 1: ใช้เครื่องมือแยกสีฟรีในเบราว์เซอร์

SVG Color Separator รับชุดย่อย SVG ที่จำกัดอย่างตั้งใจ เพื่อรักษาไฟล์แทนการให้เลเยอร์ที่ดูน่าเชื่อแต่ผิด

1. เลือก SVG

เลือก SVG ขนาดไม่เกิน 5 MiB เอกสารถูกตรวจภายใน browser worker ที่ใช้ชั่วคราวก่อนสร้างตัวอย่างหรือไฟล์ดาวน์โหลดที่ปลอดภัย เนื้อหา SVG ชื่อไฟล์ พาธ สี ภาพตัวอย่าง และไฟล์ที่สร้างไม่ถูกส่งไป PerfectVector

เวอร์ชันปัจจุบันออกแบบสำหรับงานเวกเตอร์สีเติมทึบที่ไม่โปร่งใส: พาธ สี่เหลี่ยม วงกลม วงรี รูปหลายเหลี่ยม และเส้นหลายช่วงที่รองรับพร้อมการแปลงพิกัดทั่วไป จัดการสีเติมทึบแบบ inline และแบบสืบทอดที่รองรับได้

2. ตรวจความเข้ากันได้และขนาด

ตรวจภาพรวมที่ผ่านการตรวจ ขนาดจริง viewBox จำนวนพาธ ชุดค่าสีตรงกัน และคำเตือน หากไฟล์มี viewBox แต่ไม่มีความกว้างและความสูงจริงที่เชื่อถือได้ ให้ยืนยันหนึ่งด้าน อีกด้านจะคงสัดส่วน

การประมวลผลหยุดแทนการตัดเนื้อหาไม่รองรับทิ้ง เงื่อนไขหยุดปัจจุบันรวมเส้นขอบที่มองเห็น การไล่สี ลวดลาย ฟิลเตอร์ พาธตัดภาพ มาสก์ ข้อความที่แก้ไขได้ ภาพฝัง การอ้างอิงวัตถุใช้ซ้ำ SVG ซ้อน ทรัพยากรภายนอก สไตล์ชีตหรือคลาส สคริปต์ ตัวจัดการเหตุการณ์ และสีสำหรับตัดที่โปร่งใส

ขอบเขตนี้สอดคล้องกับโมเดล SVG เอง ข้อกำหนดการระบายสี SVG 2 แยกสีทึบออกจากการไล่สี ลวดลาย ความทึบสีเติม และการทำงานเส้นขอบ “สี” ที่เห็นไม่ได้เป็นค่าเรียบค่าเดียวที่ย้ายเข้าไฟล์อย่างปลอดภัยได้เสมอ

3. ตรวจตัวอย่างแต่ละค่าสี

เครื่องมือสร้างตัวอย่างหนึ่งชุดต่อสีทึบที่มีค่าตรงกัน ตรวจว่า:

• รูปทรงที่คาดปรากฏในไฟล์สีที่ถูกต้อง;
• ไม่มีเส้นขอบ ข้อความ หรือเนื้อหาภาพที่ต้องการหายไป;
• ขนาดภาพรวมตรงกับต้นฉบับ;
• แต่ละเลเยอร์คงตำแหน่งเดิม;
• ชุดสีมีจำนวนสีผลิตที่ตั้งใจ

SVG สีเดียวก็ใช้ได้ เพราะแยกแล้วในตัว ไฟล์ที่มี 2 ถึง 24 ค่าสีได้รับมุมมองเลเยอร์ปกติ จำนวนที่สูงกว่านั้นยังรับได้ภายในขอบเขตความปลอดภัย แต่สีหลายสิบสีมักบอกว่าควรเก็บชุดสีก่อน มากกว่า 256 ค่าสีจะถูกปฏิเสธ

4. ดาวน์โหลดไฟล์

ดาวน์โหลดไฟล์สีที่ต้องการทีละไฟล์หรือใช้ไฟล์บีบอัดที่สร้างในเครื่อง แต่ละผลลัพธ์คงความกว้าง ความสูง viewBox และระบบพิกัดเดียวกัน ชื่อไฟล์และลำดับเลเยอร์กำหนดแน่นอน จึงส่งต่องานซ้ำแบบเดิมได้

เครื่องมือแยกสีและการดาวน์โหลดเลเยอร์ไม่ต้องสมัครหรือใช้เครดิต แยกจากขั้นตอนดาวน์โหลดแรสเตอร์เป็นเวกเตอร์แบบชำระเงินของ PerfectVector

วิธีที่ 2: แยกสีในโปรแกรมเวกเตอร์

ใช้ Illustrator, Inkscape, Affinity หรือโปรแกรมเวกเตอร์อื่นเมื่อ SVG ต้องซ่อมก่อนแยกสี

1. เปิดสำเนาและจดความกว้าง ความสูง และ viewBox หรืออาร์ตบอร์ดของเอกสาร
2. แปลงข้อความที่แก้ไขได้เป็นเส้นรอบรูปหากปลายทางต้องการรูปทรง
3. ใช้ Expand หรือแทนเส้นขอบ การไล่สี ลวดลาย มาสก์ และโครงสร้างตัดภาพที่ไม่รองรับอย่างตั้งใจ
4. เลือกรูปทรงตัวแทนหนึ่งชิ้น แล้วใช้คำสั่ง Select Same Fill Color ของโปรแกรม
5. คัดลอกรูปทรงที่เลือกไปยังอาร์ตบอร์ดสำเนาที่มีขนาดและจุดกำเนิดเดียวกัน
6. ลบหรือซ่อนสีอื่นโดยไม่ย้ายรูปทรงที่เลือก
7. ส่งออกไฟล์สีเป็น SVG แล้วทำซ้ำ
8. นำทุกไฟล์เข้าร่วมกันอีกครั้งเพื่อยืนยันว่าซ้อนตรงกันพอดี

อย่าสร้างเอกสารใหม่ที่พอดีกับแต่ละพื้นที่เลือก ทำสำเนาอาร์ตบอร์ดเดิมหรือใช้ค่าส่งออกที่รักษาขอบเขตเดิม

การแก้ด้วยมือยังให้รวมรูปทรงสีเดียวกันเมื่อช่วยการผลิตได้ อย่ารวมอัตโนมัติหากรู การซ้อน ลำดับระบายต้นฉบับ หรือการแก้ภายหลังพึ่งวัตถุแยก

เตรียมไฟล์สำหรับ Cricut

คู่มืออัปโหลดภาพปัจจุบันของ Cricut ระบุว่า SVG มีเลเยอร์อัปโหลดตามที่ออกแบบ และปรากฏเป็นภาพจัดกลุ่มซึ่งย้ายหรือปรับขนาดเลเยอร์แยกได้หลังยกเลิกกลุ่ม อีกทั้งระบุขีดจำกัด SVG 5,000 พาธ

ก่อนตัด:

1. อัปโหลดไฟล์แยกทั้งหมด
2. เพิ่มบน Canvas เดียวกันโดยไม่เปลี่ยนขนาด
3. ยืนยันว่าแต่ละไฟล์รายงานความกว้างและความสูงเดียวกัน
4. ใช้ตัวควบคุมตำแหน่งหรือวิธีอ้างอิงตำแหน่งร่วมกันหากเวิร์กโฟลว์ต้องซ้อนอย่างแม่นยำ
5. กำหนดการทำงานและสีวัสดุที่ถูกต้องให้แต่ละเลเยอร์
6. ทดลองเล็ก ๆ ด้วยวัสดุราคาไม่แพง

คู่มือรายการไม่รองรับของ Cricut ระบุสีเติมลวดลาย การไล่สี พาธตัดภาพ ข้อความที่แก้ไขได้ ภาพลิงก์ และภาพฝังที่ไม่รองรับ เป็นปัญหาสำหรับการอัปโหลดเวกเตอร์มีเลเยอร์ แปลงข้อความเป็นรูปทรงและลดฟีเจอร์เหล่านั้นอย่างตั้งใจก่อนส่งออก

สำหรับตรวจในภาพรวม อ่านวิธีตรวจ SVG ก่อนตัด หากไฟล์แยกนำเข้าขนาดไม่คาด ใช้การวิเคราะห์ SVG ขนาดผิด ก่อนปรับขนาดเลเยอร์ทีละชิ้น

ข้อผิดพลาดแยกสีที่พบบ่อย

เลเยอร์ไม่ตรงกันอีกแล้ว

แต่ละสีน่าจะถูกครอปตามขอบตัวเอง หรือวางในเอกสารที่จุดกำเนิดต่างกัน ส่งออกใหม่โดยใช้อาร์ตบอร์ด ความกว้าง ความสูง และ viewBox เดิม

“สี” เดียวกลายเป็นหลายไฟล์

SVG มีค่าเกือบซ้ำ ตัดสินว่าค่าใดมีหน้าที่เดียวกัน รวมอย่างตั้งใจ แล้วแยกใหม่

การไล่สีหายหรือถูกปฏิเสธ

การไล่สีเป็นระบบสีเติม ไม่ใช่สีเติมทึบค่าเดียว แทนด้วยพื้นที่สีทึบที่ตั้งใจ เก็บเวิร์กโฟลว์ไล่สีเดิม หรือใช้วิธีผลิตแรสเตอร์เมื่อความตรงของโทนสำคัญ

ข้อความหรือเส้นขอบหาย

ข้อความที่แก้ไขได้และเส้นขอบที่มองเห็นมีโครงสร้างต่างจากพาธเส้นรอบรูปเติมสี แปลงเป็นรูปทรงในโปรแกรมเวกเตอร์เฉพาะเมื่อสอดคล้องกับข้อกำหนดปลายทาง

Cricut ปฏิเสธไฟล์

ตรวจฟีเจอร์ไม่รองรับและจำนวนพาธก่อน ไฟล์อาจเป็น SVG ถูกต้องแต่ยังอยู่นอกชุดย่อยที่ Design Space รับ

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

SVG มีหลายสีได้ไหม? ได้ รูปทรง SVG ใช้สีเติมและเส้นขอบต่างกันได้ และ SVG รองรับการไล่สี ลวดลาย ความทึบ และสีอ้างอิงด้วย การแยกตามค่าสีง่ายที่สุดสำหรับสีเติมทึบที่ไม่โปร่งใส

ทำไมไฟล์ที่แยกมีพื้นที่ว่างมาก? พื้นที่ว่างรักษาอาร์ตบอร์ดและพิกัดเดิม ทำให้แต่ละสียังตรงตำแหน่งเมื่อนำไฟล์เข้าหรือประกอบกลับ

สี SVG ที่คล้ายกันจะรวมอัตโนมัติไหม? ไม่ เครื่องมือแยกของ PerfectVector จัดกลุ่มเฉพาะค่าสีตรงกัน รวมสีเกือบซ้ำอย่างตั้งใจก่อนแยกหากควรเป็นสีผลิตเดียวกัน

แยกการไล่สีเป็นไฟล์สีได้ไหม? ไม่สามารถแยกเป็นเลเยอร์สีทึบตามค่าสีได้โดยไม่เปลี่ยนงาน แทนการไล่สีด้วยพื้นที่สีทึบที่เลือก เก็บเวิร์กโฟลว์ไล่สีเดิม หรือใช้ผลลัพธ์แรสเตอร์เมื่อรายละเอียดโทนเรียบสำคัญ

SVG Color Separator ฟรีไหม? ฟรี SVG ที่รองรับถูกตรวจ แสดงตัวอย่าง แยก และดาวน์โหลดภายในเครื่องโดยไม่ต้องมีบัญชีหรือเครดิต ไฟล์ประกอบหน้าเว็บคงโหลดตามปกติ แต่ข้อมูลเอกสารอยู่ในเบราว์เซอร์

แหล่งอ้างอิง

1. PerfectVector — SVG Color Separator — ข้อกำหนดปัจจุบันเรื่องประมวลผลในเครื่อง ค่าสีตรงกัน การจัดตำแหน่ง ความเข้ากันได้ และการดาวน์โหลด
2. W3C — การระบายสี SVG 2 — นิยามสีเติม เส้นขอบ สีทึบ การไล่สี ลวดลาย ความทึบ และสีอ้างอิง
3. Cricut — วิธีอัปโหลดภาพเข้า Design Space — การนำเข้า SVG มีเลเยอร์และขีดจำกัดพาธปัจจุบัน
4. Cricut — การอัปโหลดภาพ: รายการไม่รองรับ — ข้อจำกัดปัจจุบันของการไล่สี ลวดลาย การตัดภาพ ข้อความ และภาพ สำหรับการอัปโหลดเวกเตอร์มีเลเยอร์

---

พร้อมให้ทุกสีตรงตำแหน่งแล้ว? เปิด SVG Color Separator ฟรี ตรวจตัวอย่างแต่ละค่าสีและขนาด แล้วดาวน์โหลดเมื่ออาร์ตบอร์ดร่วมผ่านการตรวจแล้วเท่านั้น