เครื่องมือสร้าง Border Radius
ปรับมุมแต่ละมุมให้โค้งมนด้วยแถบเลื่อน สร้างรูปทรงหยดน้ำที่เป็นธรรมชาติด้วยโหมดวงรี และคัดลอก CSS ได้ทันที
ทุกมุมจะถูกวาดขึ้นในเบราว์เซอร์ของคุณโดยตรง ไม่มีการอัปโหลดข้อมูลที่คุณตั้งค่าไว้ไปยัง BroBroGo
คำถามที่พบบ่อย
การทำงานของมุมทั้งสี่และการเลือกใช้ px กับ % เป็นอย่างไร?
แถบเลื่อนทั้งสี่จะควบคุมมุมตามเข็มนาฬิกา ได้แก่ บนซ้าย, บนขวา, ล่างขวา และล่างซ้าย หากใช้หน่วยพิกเซล (px) มุมจะโค้งมนตามค่าคงที่ที่กำหนด แต่หากใช้หน่วยเปอร์เซ็นต์ (%) ความโค้งมนจะเทียบกับขนาดของกล่อง โดยเปอร์เซ็นต์ในแนวนอนจะอิงตามความกว้าง และเปอร์เซ็นต์ในแนวตั้งจะอิงตามความสูง ดังนั้นค่า 50% จะเปลี่ยนสี่เหลี่ยมจัตุรัสให้กลายเป็นวงกลมพอดี
โหมดวงรี (Elliptical) มีไว้เพื่ออะไร?
หากปิดโหมดนี้ ทุกมุมจะเป็นส่วนโค้งแบบหนึ่งส่วนสี่ของวงกลมที่มีรัศมีเดียว แต่หากเปิดใช้งาน แต่ละมุมจะมีรัศมีแนวนอนและแนวตั้งแยกกัน ซึ่งช่วยให้คุณสร้างรูปทรงที่ดูนุ่มนวลและเป็นธรรมชาติเหมือน "หยดน้ำ" (Blob) ได้ เครื่องมือสร้างนี้จะเขียนโค้ดในรูปแบบสแลชสองค่าให้คุณโดยอัตโนมัติ และจะกลับไปใช้รูปแบบสั้นเมื่อมุมกลับมาโค้งมนเท่ากันอีกครั้ง
จะสร้างวงกลมที่สมบูรณ์แบบหรือรูปทรงแคปซูลได้อย่างไร?
เชื่อมโยงมุมทั้งหมดเข้าด้วยกัน เปลี่ยนหน่วยเป็นเปอร์เซ็นต์ (%) แล้วตั้งค่าเป็น 50% รูปสี่เหลี่ยมจัตุรัสก็จะกลายเป็นวงกลมทันที สำหรับปุ่มรูปทรงแคปซูล (Pill) ให้ใช้หน่วยพิกเซล (px) เช่นเดิม แล้วลากมุมใดมุมหนึ่งให้เกินครึ่งหนึ่งของความสูงของปุ่ม ขอบด้านข้างจะยังคงโค้งมนอย่างสมบูรณ์ไม่ว่าปุ่มจะกว้างเท่าใดก็ตาม โดยคุณสามารถใช้พรีเซ็ต Circle เพื่อตั้งค่าแบบแรกได้ในคลิกเดียว