CSS Gradient ใช้อย่างไร?

คัดลอก CSS code ที่สร้างได้ แล้ววางใน property background ของ CSS element ที่ต้องการ

ข้อมูลถูกส่งไปเซิร์ฟเวอร์หรือไม่?

ไม่ ทุกอย่างทำงานบนเบราว์เซอร์ ไม่มีข้อมูลถูกส่งออกไป

ตัวอย่าง Gradient

ทิศทาง

สี

CSS Code

background: linear-gradient(to right, #3B82F6, #8B5CF6);

Ad Space

CSS Gradient คือการไล่ระดับสี ใช้สร้างพื้นหลังที่สวยงามโดยไม่ต้องใช้รูปภาพ ช่วยให้เว็บโหลดเร็วขึ้นและปรับขนาดได้ไม่จำกัด

Gradient มี 2 แบบหลัก: Linear Gradient (ไล่ระดับเส้นตรง) และ Radial Gradient (ไล่ระดับวงกลม) สามารถใช้สี 2 สีขึ้นไป

Linear Gradient — ไล่ระดับเส้นตรง กำหนดทิศทางได้ (ซ้ายไปขวา, บนลงล่าง, มุมเฉียง)
Radial Gradient — ไล่ระดับจากจุดศูนย์กลางออกรอบนอก เป็นวงกลมหรือวงรี

Ad Space

คัดลอก CSS code ที่สร้างได้ แล้ววางใน property background หรือ background-image ของ CSS element ที่ต้องการ

ได้ กดปุ่ม 'เพิ่มสี' เพื่อเพิ่ม Color Stop ใหม่ CSS Gradient รองรับหลายสีได้ไม่จำกัด

Linear Gradient ไล่ระดับเป็นเส้นตรง ส่วน Radial Gradient ไล่ระดับจากจุดศูนย์กลางเป็นวงกลม

ได้ ใช้ background-clip: text และ -webkit-background-clip: text ร่วมกับ color: transparent ใน CSS

ไม่ ทุกอย่างทำงานบนเบราว์เซอร์ของคุณ ไม่มีข้อมูลถูกส่งออกไป

เครื่องมือนี้ทำงานบนเบราว์เซอร์ ไม่มีการส่งข้อมูลไปเซิร์ฟเวอร์ CSS code ที่สร้างได้รองรับทุกเบราว์เซอร์สมัยใหม่

คำนวณ BMI

คำนวณค่าดัชนีมวลกาย (BMI) เพื่อประเมินรูปร่างและความเสี่ยงด้านสุขภาพ

คำนวณภาษี

คำนวณภาษีเงินได้บุคคลธรรมดา พร้อมค่าลดหย่อนภาษี อัตราก้าวหน้า

คำนวณสินเชื่อ/ผ่อนบ้าน

คำนวณค่าผ่อนบ้าน ดอกเบี้ยรวม พร้อมตารางผ่อนชำระรายเดือน