การควบคุมการไล่ระดับสี
.gradient-text { background: linear-gradient(to right, #4F46E5, #EC4899); background-clip: text; -webkit-background-clip: text; -webkit-text-fill-color: transparent; }
การไล่ระดับสียอดนิยม
วิธีใช้
ป้อนข้อความของคุณ
พิมพ์ข้อความที่คุณต้องการใช้การไล่ระดับสีในช่องป้อนข้อมูล "ข้อความ"
เลือกประเภทการไล่ระดับสี
เลือกระหว่างประเภทการไล่ระดับสีเชิงเส้น เรเดียล หรือทรงกรวย
ปรับทิศทางหรือมุม
สําหรับการไล่ระดับสีเชิงเส้น ให้เลือกทิศทาง สําหรับการไล่ระดับสีกรวย ให้ตั้งค่ามุม
ปรับแต่งสี
เพิ่ม ลบ หรือปรับจุดหยุดสีและตําแหน่งเพื่อสร้างการไล่ระดับสีที่คุณต้องการ
คัดลอกหรือบันทึก CSS
คัดลอกโค้ด CSS ที่สร้างขึ้นหรือบันทึกเป็นไฟล์ CSS เพื่อใช้ในโปรเจ็กต์ของคุณ
เกี่ยวกับการไล่ระดับสีข้อความ
การไล่ระดับสีข้อความ CSS ช่วยให้คุณใช้การไล่ระดับสีที่สวยงามและหลากสีกับข้อความได้โดยตรง เอฟเฟกต์นี้เคยทําได้เฉพาะกับรูปภาพเท่านั้น แต่ CSS ที่ทันสมัยทําให้ง่ายและมีประสิทธิภาพ
รองรับเบราว์เซอร์:การไล่ระดับสีข้อความได้รับการสนับสนุนในเบราว์เซอร์สมัยใหม่ทั้งหมด รวมถึง Chrome, Firefox, Safari และ Edge สําหรับเบราว์เซอร์รุ่นเก่า เช่น Internet Explorer ข้อความจะกลับไปเป็นสีทึบ
เคล็ดลับการใช้งาน:การไล่ระดับสีข้อความทํางานได้ดีที่สุดกับข้อความตัวหนาและการผสมสีที่มีความเปรียบต่างสูง ทดลองกับประเภทการไล่ระดับสีและทิศทางต่างๆ เพื่อให้ได้เอฟเฟกต์ที่ต้องการ
Related Tools
ตัวย่อขนาด CSS
บีบอัดและเพิ่มประสิทธิภาพโค้ด CSS ของคุณด้วยความแม่นยําระดับมืออาชีพ
สร้างการแปลง CSS3 ได้อย่างง่ายดาย
เครื่องมือที่ทรงพลังและใช้งานง่ายสําหรับการสร้างการแปลง CSS3 ที่ซับซ้อนโดยไม่ต้องเขียนโค้ด แสดงภาพการเปลี่ยนแปลงแบบเรียลไทม์และคัดลอก CSS ที่สร้างขึ้นเพื่อใช้ในโครงการของคุณ
Less to CSS Converter
แปลงโค้ด Less ของคุณเป็น CSS รวดเร็ว ง่ายดาย และปลอดภัย
เครื่องคํานวณ CPM
คํานวณต้นทุนต่อพันปี (CPM) สําหรับแคมเปญโฆษณาของคุณด้วยเครื่องคํานวณที่ใช้งานง่ายของเรา
สร้างเลย์เอาต์ Flexbox ที่สมบูรณ์แบบ
แสดงภาพ ปรับแต่ง และสร้างโค้ดเฟล็กซ์บ็อกซ์ CSS ด้วยอินเทอร์เฟซแบบลากและวางที่ใช้งานง่ายของเรา
ตัวจัดรูปแบบ JSON
ตัวจัดรูปแบบ JSON และตัวตรวจสอบ JSON ที่ดีที่สุด