Trình tạo SVG sóng
Điều chỉnh kích thước, hình dạng và màu sóng để tạo đường phân cách hoặc nền cho trang web. Sao chép hoặc lưu SVG hay CSS nền, hoặc lưu một ảnh PNG.
Bạn có thể làm gì
Điều chỉnh hình dạng và màu sắc
Điều chỉnh chiều cao sóng, số sóng, vị trí và hướng tô, rồi tạo bằng một hoặc hai màu.
Lấy kết quả ở định dạng phù hợp với nhu cầu của bạn
Sao chép và lưu mã SVG hoặc nền CSS, hoặc lưu dưới dạng ảnh PNG.
Cách sử dụng
Chọn hình dạng bắt đầu
Điều chỉnh trực tiếp các giá trị, hoặc chọn một hình dạng tương tự trong “Chọn một mẫu”.
Điều chỉnh kích thước và màu sắc
Chỉ định chiều rộng, chiều cao, biên độ và số sóng. Điều chỉnh vị trí bắt đầu và chiều cao trung tâm trong cài đặt nâng cao.
Tạo và kiểm tra SVG
Kiểm tra hình dạng sóng đã tạo và các vùng trong suốt. Hãy tạo lại sau khi thay đổi cài đặt.
Lấy định dạng bạn cần
Chọn SVG hoặc nền CSS để sao chép hay lưu, hoặc lưu PNG.
Hữu ích cho
Phân chia các mục trang
Tạo đường phân cách hình sóng giữa các mục nội dung hoặc phía trên chân trang.
Hòa hợp với màu sắc trang web của bạn
Dùng màu đặc hoặc chuyển màu để tạo tài nguyên nền khớp với bảng màu của trang.
Hình dạng sóng và định dạng lưu
Biên độ và số sóng
Biên độ là độ lớn của biến thiên theo chiều dọc, còn số sóng là số chu kỳ trên toàn bộ chiều rộng. Đây không phải tính năng hiển thị dạng sóng âm thanh.
Vị trí sóng và các vùng bị cắt
Thay đổi vị trí bắt đầu bằng pha, và vị trí dọc bằng chiều cao trung tâm. Các phần nằm ngoài ảnh sẽ bị cắt.
Chọn giữa SVG và PNG
SVG biểu diễn hình dạng dưới dạng vector. PNG lưu ảnh ở kích thước pixel đã chỉ định và giữ các vùng trong suốt.
Cách đặt nền CSS
CSS chỉ định một ảnh nền. Hãy đặt chiều rộng và chiều cao của phần tử nơi bạn dùng nó để tạo khoảng không gian cho ảnh nền hiển thị.
Câu hỏi thường gặp
Tôi có thể điều chỉnh hình dạng sóng và màu sắc không?
Bạn có thể chỉ định giá trị và màu sắc. Chọn “Dùng hai màu” để đặt màu thứ hai và góc chuyển màu.
Điều gì xảy ra với cài đặt hiện tại khi tôi chọn một mẫu?
Các cài đặt, gồm chiều rộng, chiều cao và màu sắc, sẽ bị thay thế bằng cài đặt của mẫu. Hãy điều chỉnh các giá trị cần thiết sau khi chọn.
Phần xem trước có thay đổi khi tôi đổi cài đặt không?
Sau khi thay đổi, hãy chọn “Tạo SVG” để kiểm tra kết quả. Kết quả đã tạo trước đó không còn dùng để hiển thị hoặc lưu.
SVG có phải là sóng sin chính xác không?
Sóng được xấp xỉ bằng một đường cong cubic mượt mà. Nó không phải dạng sóng để đo lường toán học hay phân tích âm thanh.
Xử lý tệp
- Đầu vào
- Tạo từ các cài đặt sóng dạng số và màu sắc. Không cần chọn ảnh.
- Kết quả
- wave.svg, wave.css và wave.png. Có thể sao chép SVG và CSS.