Trình tạo Border Radius
Bo tròn từng góc bằng thanh trượt, tạo hình giọt nước tự nhiên với chế độ elip và sao chép mã CSS ngay lập tức.
Mọi góc bo tròn đều được xử lý trực tiếp trong trình duyệt của bạn. Không có dữ liệu nào bạn thiết lập được tải lên BroBroGo.
Hỏi đáp
Cách hoạt động của bốn góc và sự khác biệt giữa px và % là gì?
Bốn thanh trượt tương ứng theo chiều kim đồng hồ với các góc: trên-trái, trên-phải, dưới-phải và dưới-trái. Với đơn vị pixel (px), góc được bo tròn theo một lượng cố định; với đơn vị phần trăm (%), góc được bo tròn so với kích thước hộp — phần trăm ngang theo chiều rộng và phần trăm dọc theo chiều cao, do đó 50% sẽ biến hình vuông thành hình tròn.
Chế độ góc hình elip (elliptical mode) có tác dụng gì?
Khi tắt chế độ này, mỗi góc là một phần tư hình tròn với một bán kính duy nhất. Khi bật lên, mỗi góc sẽ có bán kính ngang và dọc riêng biệt, giúp bạn tạo ra các hình dạng "giọt nước" hoặc hữu cơ mềm mại. Trình tạo sẽ tự động viết mã dạng dấu gạch chéo hai giá trị cho bạn và quay lại dạng rút gọn khi các góc tròn đều trở lại.
Làm thế nào để tạo một hình tròn hoàn hảo hoặc hình viên thuốc?
Liên kết các góc lại, chuyển sang đơn vị phần trăm (%) và đặt giá trị 50%: một hình vuông sẽ biến thành hình tròn. Đối với nút dạng viên thuốc (pill), hãy giữ đơn vị pixel (px) và kéo một góc vượt quá một nửa chiều cao của nút — các cạnh sẽ luôn được bo tròn hoàn toàn ở mọi chiều rộng. Tùy chọn có sẵn "Hình tròn" (Circle) sẽ thiết lập trường hợp đầu tiên chỉ với một cú nhấp chuột.