แปลง PSD เป็น SVG
บันทึกงานออกแบบ Photoshop เป็นไฟล์ .svg สำหรับโปรแกรมที่รับเฉพาะ SVG ตัวแปลงจะรวมเลเยอร์ของ PSD ให้เป็นภาพเดียวแล้วห่อภาพนั้นไว้ใน SVG อ่านต่อด้านล่างเพื่อดูว่าเมื่อใดวิธีนี้เพียงพอ และเมื่อใดโลโก้ต้องแปลงเป็นเส้นเวกเตอร์
แปลงไฟล์รูปภาพ
หรือลากไฟล์ JPG, JPEG, JPE … มาวางที่นี่ ·
สูงสุด 95 MB ต่อไฟล์· ได้สูงสุด 20 ไฟล์· ลบหลังจาก 30 นาที
ไฟล์จะถูกประมวลผลบนเซิร์ฟเวอร์ของเราและถูกลบหลังจาก 30 นาที
ค่า 85 ทำให้ภาพถ่ายดูเหมือนต้นฉบับทุกประการ ควรลดค่านี้เฉพาะเมื่อต้องการไฟล์ที่เล็กลง
JPG, BMP และ EPS ไม่รองรับความโปร่งใส พิกเซลโปร่งใสจะถูกเติมด้วยสีนี้
รหัสสีแบบ Hex ที่ใช้แทนพิกเซลโปร่งใส เช่น #FFFFFF
รูปแบบนี้เก็บภาพได้เพียงภาพเดียว หากต้องการคงภาพเคลื่อนไหวไว้ ให้เลือกผลลัพธ์เป็น GIF หรือ WebP
ไอคอนหลายขนาดจะรวมความละเอียดหลายระดับไว้ในไฟล์เดียว เบราว์เซอร์และระบบปฏิบัติการจะเลือกขนาดที่ต้องใช้เอง
คงขนาดภาพเดิมไว้ หรือกำหนดด้านใดด้านหนึ่ง โดยระบบจะคงอัตราส่วนภาพไว้
จำนวนพิกเซลของด้านที่เลือกไว้ด้านบน
เปอร์เซ็นต์ของขนาดภาพต้นฉบับ
sRGB เหมาะสำหรับหน้าจอและเว็บไซต์ ควรคงค่าเดิมไว้สำหรับงานพิมพ์ ส่วนระดับสีเทาจะตัดสีออกทั้งหมด
เป็นข้อมูลเมตาเท่านั้น ค่า 0 จะคงค่าเดิมไว้ เครื่องพิมพ์และบางเว็บไซต์จะอ่านค่านี้ แต่จะไม่เปลี่ยนขนาดภาพเป็นพิกเซล
วิธีใช้เครื่องมือนี้
- 1
อัปโหลดไฟล์ PSD
เลือกไฟล์ .psd อย่างน้อยหนึ่งไฟล์ ได้สูงสุด 20 ไฟล์ต่อครั้ง ไฟล์ละไม่เกิน 95 MB
- 2
กด แปลงเป็น SVG
ระบบจะรวมเลเยอร์ที่มองเห็นให้เป็นภาพเดียวตามขนาดแคนวาส แล้วฝังลงในเอกสาร SVG ไม่มีตัวเลื่อนปรับคุณภาพ เพราะบิตแมปที่อยู่ภายในถูกเก็บแบบไม่สูญเสียคุณภาพ
- 3
เปิดไฟล์ผลลัพธ์
นำไฟล์ .svg ไปเปิดในเบราว์เซอร์ Figma หรือ Inkscape ภาพจะดูเหมือนไฟล์ PSD และเมื่อซูมเข้าไปมาก ๆ จะเห็นเป็นพิกเซล ซึ่งเป็นเรื่องปกติ
แปลง PSD เป็น SVG: ตัวแปลงเขียนอะไรลงในไฟล์จริง ๆ
ไฟล์ PSD คือเลเยอร์ซ้อนกันหลายชั้น ได้แก่ เลเยอร์พิกเซลจากรูปถ่ายและแปรง เลเยอร์ปรับแต่งที่เปลี่ยนพิกเซลด้านล่าง เลเยอร์ข้อความ สมาร์ตออบเจกต์ และเลเยอร์รูปทรง ซึ่ง Photoshop เก็บเป็นพาธเวกเตอร์มาตั้งแต่เวอร์ชัน 6.0 ในปี 2000 Photoshop เปิดตัวในเดือนกุมภาพันธ์ 1990 และฟอร์แมต PSD ยังเก็บภาพรวมของเลเยอร์ที่มองเห็นไว้ เพื่อให้โปรแกรมอื่นแสดงงานได้โดยไม่ต้องเข้าใจเลเยอร์ทุกชนิด
ตัวแปลงนี้ใช้ภาพรวมดังกล่าว โดยเรนเดอร์เลเยอร์ที่มองเห็นเป็นภาพเดียวตามขนาดแคนวาส แล้วเขียนเอกสาร SVG ที่มีเพียงภาพนั้นเป็นเนื้อหา SVG จึงมีความกว้าง ความสูง และความโปร่งใสถูกต้อง นำไปวางในหน้าเว็บหรือเลย์เอาต์ได้เหมือนต้นฉบับ แต่ไม่มีรูปทรงที่แก้ไขได้เลยสักรูปเดียว ทุกขอบ รวมถึงขอบของเลเยอร์รูปทรงเป็นพิกเซล เอฟเฟกต์ มาสก์ และโหมดการผสมไม่มีสิ่งที่เทียบเท่าใน SVG แบบหนึ่งต่อหนึ่ง ผลที่เรนเดอร์แล้วจึงเป็นผลลัพธ์ที่ตรงไปตรงมาที่สุด
- ความกว้างหรือความสูงสูงสุดของ PSD
- 30,000 px
- ขนาดไฟล์ PSD สูงสุด (งานที่ใหญ่กว่านี้ใช้ PSB)
- 2 GB
- ไฟล์ PSD ที่ใหญ่ที่สุดที่ตัวแปลงนี้รองรับ
- 95 MB
- ไฟล์ PSD ต่อครั้ง
- 20
PSD
Adobe Photoshop Document
PSD เป็นรูปแบบไฟล์หลักของ Adobe Photoshop ที่ใช้มาตั้งแต่ปี 1990 เก็บเลเยอร์ มาสก์ เลเยอร์ปรับแต่ง ข้อความ smart object แชนเนล และโปรไฟล์สีไว้ ทำให้แก้ไขงานออกแบบภายหลังได้โดยไม่สูญเสียคุณภาพ ไฟล์มักมีขนาดใหญ่มาก และต้องใช้ Photoshop จึงจะเปิดได้ครบถ้วนสมบูรณ์ โปรแกรมอื่นอย่าง GIMP, Photopea และ Affinity เปิด PSD ได้ด้วยความแม่นยำที่แตกต่างกัน เบราว์เซอร์ โทรศัพท์ และแบบฟอร์มอัปโหลดส่วนใหญ่แสดง PSD โดยตรงไม่ได้
- การบีบอัด
- แบบไม่สูญเสียข้อมูล
- พื้นหลังโปร่งใส
- ได้
- ภาพเคลื่อนไหว
- ไม่ได้
- เปิดตัว
- 1990 · Adobe
SVG
Scalable Vector Graphics
SVG เป็นรูปแบบเวกเตอร์ที่อิงกับ XML ซึ่ง W3C กำหนดเป็นมาตรฐานในปี 2001 แทนที่จะใช้พิกเซล จะอธิบายรูปทรง เส้นพาธ และข้อความ จึงคมชัดในทุกขนาด และมักมีขนาดเล็กมากสำหรับโลโก้และไอคอน รองรับพื้นหลังโปร่งใส การจัดสไตล์ด้วย CSS สคริปต์ และภาพเคลื่อนไหว และเบราว์เซอร์ทุกตัวแสดงผลได้โดยตรง SVG ไม่เหมาะกับภาพถ่าย และภาพประกอบที่ซับซ้อนอาจแสดงผลช้า Illustrator, Inkscape, Figma และเบราว์เซอร์เปิดและแก้ไขไฟล์นี้ได้
- การบีบอัด
- –
- พื้นหลังโปร่งใส
- ได้
- ภาพเคลื่อนไหว
- ได้
- เปิดตัว
- 2001 · W3C
คนค้นหา PSD เป็น SVG เมื่อเว็บบิลเดอร์ แพลตฟอร์มเทมเพลต หรือเครื่องตัดต้องการ SVG แต่งานออกแบบมีอยู่เป็นไฟล์ Photoshop สิ่งที่ได้คืองานภาพที่รวมเป็นภาพเดียวอยู่ในคอนเทนเนอร์ SVG
เลเยอร์รูปทรง สมาร์ตออบเจ็กต์ และพิกเซลในไฟล์ PSD
ความเชื่อบันทึกเป็น .svg แล้วงานออกแบบทุกชิ้นจะขยายได้ไม่จำกัด
ข้อเท็จจริงความสามารถในการขยายมาจากพาธ SVG ที่ใส่บิตแมปไว้จะนุ่มลงเมื่อเกินขนาดพิกเซลเหมือน PNG
ความเชื่อโลโก้ที่วาดด้วยรูปทรงของ Photoshop จะถูกแปลงเป็นเวกเตอร์โดยอัตโนมัติ
ข้อเท็จจริงเครื่องมือนี้รวมเลเยอร์ก่อน รูปทรงจึงกลายเป็นพิกเซล รูปทรงเวกเตอร์ต้องส่งออกหรือเทรซแยกต่างหาก
ความเชื่อสมาร์ตออบเจกต์ยังคงเนื้อหาเวกเตอร์ที่ลิงก์ไว้
ข้อเท็จจริงไฟล์ Illustrator ที่วางไว้จะถูกเรนเดอร์ตามขนาดที่ปรากฏบนแคนวาส แล้วรวมกับส่วนอื่น
วิธีได้เส้นพาธเวกเตอร์จริงจากงานออกแบบ Photoshop
หากเป็นโลโก้ ไอคอน หรือตัวอักษรที่ต้องคมชัดทุกขนาด การเทรซคือขั้นตอนที่ต้องการ แปลงไฟล์ PSD เป็น PNG พื้นหลังโปร่งใสด้วยPSD เป็น PNG แล้วนำไปผ่านตัวแปลงรูปเป็น SVG ซึ่งจะไล่ตามขอบและเขียนเป็นพาธจริง การเทรซเหมาะกับสีเรียบและเส้นขอบคมชัด ส่วนรูปถ่ายจะกลายเป็นรูปทรงเล็ก ๆ นับพัน บทความวิธีแปลง PNG เป็น SVG อธิบายการตั้งค่าที่ช่วยให้เส้นโค้งเรียบเนียน
หากมีงานเวกเตอร์ต้นฉบับใน Illustrator, Affinity Designer หรือ Figma ให้ขอไฟล์นั้นก่อนที่จะเทรซจากสำเนาที่รวมเป็นภาพเดียวแล้ว
คำถามเกี่ยวกับการแปลง PSD เป็น SVG
เลเยอร์รูปทรงใน Photoshop จะกลายเป็นเส้นพาธ SVG ที่แก้ไขได้หรือไม่
ไม่ได้ สำหรับตัวแปลงนี้ เลเยอร์รูปทรงใน Photoshop เป็นเวกเตอร์ แต่ไฟล์ PSD จะถูกรวมเป็นบิตแมปภาพเดียวก่อนเขียนเป็น SVG ดังนั้นทุกเลเยอร์รวมถึงรูปทรงจะกลายเป็นพิกเซล หากต้องการเก็บพาธไว้ ให้ส่งออกรูปทรงจากโปรแกรมแก้ไขเวกเตอร์ หรือทำการเทรซภาพผลลัพธ์
ทำไมไฟล์ SVG ที่ได้จึงมีขนาดไฟล์ใกล้เคียงกับ PNG ของงานเดียวกัน
เพราะไฟล์ SVG นี้ส่วนใหญ่คือไฟล์ PNG บิตแมปถูกเก็บเป็นข้อความที่เข้ารหัสไว้ใน SVG ซึ่งทำให้ขนาดเพิ่มขึ้นราวหนึ่งในสาม โลโก้เวกเตอร์จริงจะมีขนาดเพียงไม่กี่กิโลไบต์
ส่งไฟล์ SVG นี้ไปใช้กับ Cricut หรือเครื่องตัดเลเซอร์ได้หรือไม่
นำเข้าได้ แต่ไม่มีเส้นให้ตัด เครื่องตัดทำงานตามเส้นขอบพาธ ส่วนบิตแมปที่ห่อไว้ไม่มีพาธ Design Space และซอฟต์แวร์เลเซอร์จึงเห็นเป็นภาพแบน ให้เทรซโลโก้ด้วยตัวแปลงรูปเป็น SVG เพื่อให้ได้เส้นตัด
ข้อความจากเลเยอร์ตัวอักษรใน Photoshop ยังเป็นข้อความใน SVG หรือไม่
ไม่ได้ เลเยอร์ข้อความจะถูกเรนเดอร์ด้วยฟอนต์แล้วรวมเป็นภาพเดียวเหมือนส่วนอื่น จึงค้นหา เลือก หรือพิมพ์แก้ข้อความไม่ได้ ให้สร้างข้อความที่แก้ไขได้ใหม่ในโปรแกรมแก้ไข SVG โดยใช้ฟอนต์เดียวกัน
SVG ที่ห่อภาพบิตแมปไว้มีประโยชน์จริงเมื่อใด
เมื่อระบบกำหนดให้ใช้นามสกุล .svg แต่แค่แสดงไฟล์ เช่น ตัวสร้างธีมและแพลตฟอร์มเทมเพลตบางแห่ง และใช้เป็นไฟล์แทนที่ชั่วคราวได้จนกว่าจะมีงานเวกเตอร์จริง
ผืนผ้าใบ PSD ที่ใหญ่ขึ้นทำให้ SVG คมชัดขึ้นหรือไม่
ได้ SVG จะคงขนาดแคนวาสไว้ ไฟล์ PSD ขนาด 4000 px จึงคมชัดเมื่อแสดงผลใหญ่กว่าไฟล์ขนาด 1000 px แต่เมื่อเกินขนาดเดิม ภาพที่ฝังไว้จะนุ่มลงเหมือนบิตแมปทั่วไป
| PSD เป็น PNG | PSD เป็น JPG | PSD เป็น PDF |
| PNG เป็น SVG | EPS เป็น SVG | แปลงรูปเป็น SVG |