17 ก.พ. 2021 เวลา 11:16 • ศิลปะ & ออกแบบ
"แนะนำ 7 Color Tools สีสวยทันใจ สั่งได้ในคลิกเดียว"
การเลือกใช้สีในงานออกแบบเป็นเรื่องที่ง่ายนิดเดียว (แต่ยากเยอะหน่อย) ปัญหาหนักอกของชาวกราฟิก บางครั้งถึงกับกินไม่ได้ นอนไม่หลับ เพราะสีที่เลือกไว้ไม่โดนใจให้ปรับแล้วปรับอีก โดยเฉพาะมือใหม่ถอดด้าม ที่ชั่วโมงบินการจิ้มเลือกสียังไ่ม่มากพอ และยังไม่แม่นยำเรื่องการใช้คู่สี หรือกำหนดเฉดสีให้โดนเด่นมีสไตล์
.
วันนี้ปัญหาหนักอกของชาวกราฟิกจะบรรเทา เราขออาสา มายกออกให้ ขอแนะนำเว็บไซต์ที่รวบรวมคู่สีที่ดูดี เอาไปใช้ก็ง๊ายง่าย พร้อมข้อดีข้อเสีย ช่วยทุ่นแรง ร่นเวลา ให้เราสามารถเอาเวลาไปรับงานเพิ่ม หรือเจียดไปพักผ่อนเอาแรง แบบไม่ต้องเสียเวลาสาละวนกับการเลือกสีที่บางทีใช้เวลาเป็นวัน จะมีอะไรบ้างนั้น ไปดูกันค่าาาา
Palette Generator random
ชุดสีดี ๆ สวย ๆ ไว้ใช้งาน
ช่วยแก้ปัญหา :
เลือก palette สีไม่ถูก หรือที่มีอยู่ไม่เหมาะกับงานที่ใช้
ข้อดี :
การทำงานของเว็บง่ายแค่คลิ๊ก Start The Generator ไม่ถูกใจชุดสีนี้ก็แค่เคาะ space bar จะ remove สีที่ไม่ชอบออก หรือ drag เลื่อนไล่สี ก็เพียงคลิ๊ก ลากเมาส์
[แสดงผลค่าสีในรูปแบบ ได้หลายแบบทั้ง Copy URL / PDF / Image / CSS / ASE / SVG / Code / Embed]
ถูกใจก็ Donate ค่ากาแฟสักแก้ว สองแก้ว ให้คนทำเว็บ จะได้มีแรงใจทำของดี ๆ ให้เราใช้ต่อ
ข้อเสีย :
ถ้าเป็นมือใหม่จะงง งง เวลา export ไปใช้งาน แต่ถ้าลองใช้บ่อย ๆ จะคล่องและเป็นประโยชน์อย่างแน่นอน
Color Contrast Checker
ตัวช่วยในการเลือกสีตัวอักษร (foreground) และ สีพื้นหลัง (background)
ช่วยแก้ปัญหา :
ช่วยเลือกคู่สี foreground และ backgroud คู่สีที่เด้งทะลุจอ เหมาะของตัวอักษรและพื้นหลังชัดเจน เตะตาเวลาอ่าน
ข้อดี :
แสดงผลให้เห็นแบบ realtime นักออกแบบเห็นภาพของคู่สี foreground และ backgroud ก่อนเลือกใช้ทำให้งานการวางคู่สีสำหรับ text แม่นยำและออกมา ปัง ปัง ปุริเย่
Pantone Colors
เลือก Code สี Pantone สำหรับใช้ทำงานออกแบบ
ช่วยแก้ปัญหา :
คือแบบชอบสีสไตล์ Pantone หรือลูกค้าอยากใช้สีแบบ Pantone แต่ไม่รู้ code สีที่จะนำไปใช้ สามารถเลือกสีจากนี้ได้ง่าย ๆ
ข้อดี :
สามารถหา code สีทั้ง Pantone CMYK RGB HEX color ตอบโจทย์เรื่องสีสำหรับงาน off-line / on-line
ตัวอย่างการแสดงผล (เมื่อคลิ๊กเลือกสี)
PANTONE 1245 C
COLOR VALUES:
RGB 198 146 20
HEX/HTML C69214
CMYK 2 31 98 16
ข้อเสีย :
เอาสีไปใช้ได้ยากหน่อย เพราะจะวิงเวียนสายตาเล็กน้อยถึงปานกลางในการมองหาสี
Gradient Colors Collection Palette
1
ช่วยแก้ปัญหา :
เวลานึกภาพการไล่เฉดสีแบบ Gradient สำหรับงานออกแบบเว็บไซต์ไม่ออก
ข้อดี :
มีชุดสี Gradient สวย ๆ ให้เลือกเพียบ เพียงแค่กด Show all gradients ที่ hamburger ด้านซ้ายบน หรือจะกด < > เลือกดูทีละชุดสี มีให้เพิ่มปรับแต่งชุดสีได้ด้วยตนเอง
ข้อเสีย :
มีไฟล์ให้ดาวน์โหลดเฉพาะ .jpg และ css code เท่านั้น การจะเพิ่มสีต้องรู้การเขียน .json (JavaScript Object Notation)
Color Picker
ช่วยเลือกเฉดที่ตรงใจได้ง่ายขึ้นเข้มขึ้น อ่อนลงแค่ไหนถึงจะสวย
 
ช่วยแก้ปัญหา :
การปรับเลือกเฉดสี เลือกเฉดที่ตรงใจได้ง่าย
ข้อดี :
เลือกเฉดสีได้ง่ายแค่เลื่อนเมาส์ขึ้นกำหนดจุดสีที่ต้องการใช้งาน เลือก shade การแสดงผล
 
ตัวอย่างการแสดงผล
HEX #DDCFCC
RGB 221, 207, 204
HSL 11, 8%, 83%
CMYK 0 6 8 13
สามารถ Export ชุดสีไปใช้ และ copy ไปใช้งานได้ทันที
ข้อเสีย :
ตอน Export ชุดค่าสี CMYK และ HSL หายไป
Image to Colors Palette Generator
Adobe ชื่อนี้ไว้ใจได้ แต่ละ Tools คิดมาเพื่อคนทำงานออกแบบจริง ๆ
ช่วยแก้ปัญหา :
เส้นทางลัดเมื่อต้องการหา Palette สี จากรูปภาพ โดยไม่ต้องใช้ Eyedropper Fill จุ่มทีละสี
วิธีการใช้งาน :
เพียงอัปโหลดรูป เมื่อ อัปโหลดแล้ว สามารถเลือกการแสดงผล theme สีได้ถึง 6 โทน
Colorful / Bright / Muted Da / Deep / Dark / None
หรือจะปรับเปลี่ยนโหมดการแสดงสีเป็น
Color Wheel / Extract Theme / Extract Gradient/ Accessibility Tools ก็ย่อมได้
ดีงามสุด คือเลือกสีตามกฏความกลมกลืนของสีได้ถึง 10 แบบ และสามารถ Custom ได้ด้วย
ข้อดี :
แสดงได้ทั้ง
HEX / RGB / CMYK / HSB / LAB
ข้อเสีย :
สวยทุกชุดสี จนตัดใจยาก เอาสิ!
2,498 Best Colors and Names
2,498 สีครอบจักรวาลพร้อมชื่อเรียก
ช่วยแก้ปัญหา :
ทำให้รู้จักชื่อเรียกของสี ค่าสีห่างกันนิดเดียวก็ถูกเรียกคนละชื่อ ซึ่งเป็นความรู้สีประเภท รู้ไว้ใช่ว่าใส่บ่าแบกหาม แต่รู้ไว้ก็ดีกว่า
ข้อดี :
เรียกชื่อสี แบ่งเฉดสี ตามชื่อได้ถูกต้อง
ข้อเสีย :
สีมีเยอะมากจนตาลาย คล้ายจะเป็นลม และมีแค่ HEX color ถ้าจะเอาไปใช้ plateform อื่น ต้องเอา code ไปเทียบสีก่อน
โฆษณา