Thiết kế / SVG
Trình tạo blob SVG (Hình dạng hữu cơ ngẫu nhiên)
Tạo các hình blob ngẫu nhiên, mượt mà cho nền và hình minh họa: chọn số điểm và mức độ ngẫu nhiên, chọn một màu hoặc chuyển màu hai màu, rồi tải xuống hoặc sao chép SVG.
Trình tạo blob SVG (Hình dạng hữu cơ ngẫu nhiên): Các điểm được phân bố đều quanh một đường tròn. Mỗi điểm được kéo về tâm một khoảng ngẫu nhiên, sau đó các điểm được nối bằng một đường cong kín, mượt mà. Ít điểm và mức độ ngẫu nhiên cao tạo ra hình gồ ghề; nhiều điểm và mức độ ngẫu nhiên thấp tạo ra hình mềm mại, gần tròn. Chạy 100% cục bộ trong trình duyệt của bạn, không có tệp nào được tải lên máy chủ.
- Danh mục
- Công cụ lập trình viên
- Lượt chạy
- Trong trình duyệt của bạn
- Chi phí
- Miễn phí · không cần đăng ký
- Trạng thái khả dụng
- Sẵn sàng sử dụng
Chạy hoàn toàn trong trình duyệt của bạn
SVG
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 400 400" width="400" height="400"><path d="M359.5,200 C360.7,243.5 315.4,319 278.8,336.4 C242.1,353.9 174.7,327.5 139.5,304.7 C104.4,282 69.5,237.5 68,200 C66.4,162.5 96.4,100.3 130.4,79.5 C164.4,58.7 233.7,55.4 271.9,75.5 C310.1,95.6 358.4,156.5 359.5,200 Z" fill="#63c42d"/></svg>
Các điểm được đặt đều quanh một hình tròn, mỗi điểm được kéo về phía tâm một khoảng ngẫu nhiên rồi nối lại bằng một đường cong khép kín mượt mà. Ít điểm hơn và nhiều ngẫu nhiên hơn sẽ tạo ra hình gồ ghề hơn; 0% ngẫu nhiên sẽ tạo thành hình tròn. Blob tạo nền mềm mại phía sau ảnh, biểu tượng và tiêu đề.
Công dụng
Các hình blob tạo nền mềm phía sau ảnh sản phẩm, biểu tượng, ảnh đại diện và tiêu đề. Phía sau văn bản, hãy dùng màu nhạt hoặc lớp tô có độ mờ thấp để văn bản vẫn giữ được độ tương phản; để nhìn thấy blob phía sau kính mờ, hãy kết hợp nó với trình tạo glassmorphism.
Chỉnh sửa
Kết quả là một path duy nhất với các đường cong Bézier bậc ba, nên có thể mở bằng mọi trình chỉnh sửa vector. Để thay đổi thủ công một vài điểm, hãy dán nó vào trình chỉnh sửa SVG.
Cách sử dụng
- Chọn số điểm và mức độ ngẫu nhiên.
- Chọn một màu hoặc chuyển màu.
- Nhấp để tạo blob mới cho đến khi bạn ưng ý, rồi tải xuống hoặc sao chép SVG.
Quyền riêng tư và giới hạn
Các hình được vẽ trong trình duyệt của bạn.
Công cụ liên quan
Câu hỏi thường gặp
Làm thế nào để đặt ảnh vào bên trong một blob?
Sao chép đường dẫn rồi dùng đường dẫn đó trong SVG clipPath, hoặc lưu blob và dùng nó làm CSS mask-image phủ lên ảnh.
Tôi có thể tạo hiệu ứng chuyển động cho blob không?
Có. Hãy tạo hai blob có cùng số điểm rồi tạo hiệu ứng chuyển đổi thuộc tính d của đường dẫn giữa chúng; số điểm tương ứng giúp hiệu ứng biến đổi mượt mà.
Có giới hạn kích thước không?
SVG có kích thước 400 × 400 nhưng có thể phóng to hoặc thu nhỏ đến bất kỳ kích thước nào mà không làm mất độ sắc nét.
Công cụ miễn phí · trong trình duyệt của bạn lượt chạy · không cần tài khoản