Bỏ qua đến nội dung
Công cụ miễn phíDesign

Tạo mọi kích thước favicon mà trang web của bạn cần từ một hình ảnh

Tải biểu trưng hoặc biểu tượng lên và công cụ này sẽ xuất ra các biểu tượng yêu thích ở tất cả các kích thước mà trình duyệt, hệ điều hành và bảng kê khai PWA hiện đại yêu cầu — từ ICO 16 x 16 cổ điển đến 512 x 512 PNG cho màn hình chính Android. Tải xuống gói sẵn sàng triển khai có kèm theo đoạn mã HTML.

Sử dụng công cụ này miễn phí

Browser tool

Favicon generator

Runs locally in your browser. The selected image is not uploaded by this tool.

JPEG, PNG, and WebP are supported by default. Specialized converters restrict the file picker to their required input format.

Choose an image to start.

Cách sử dụng

1

Tải lên hình ảnh của bạn

Thả tệp PNG, SVG, JPEG hoặc WebP vào trình tạo. Hình ảnh vuông ở kích thước 512 px hoặc lớn hơn sẽ mang lại kết quả sắc nét nhất.

2

Cắt và điều chỉnh

Kéo bộ điều khiển cắt để tách vùng biểu tượng. Thêm phần đệm nếu biểu tượng cần có chỗ thở. Đặt nền thành trong suốt hoặc một màu.

3

Xem trước tất cả các kích cỡ

Công cụ này hiển thị đồng thời mọi kích thước mục tiêu để bạn có thể xác minh rằng biểu tượng có thể nhận dạng được ở kích thước 16 px và trông sắc nét ở kích thước 512 px.

4

Tải xuống gói

Tải xuống tệp ZIP chứa tất cả các tệp favicon cùng với đoạn mã HTML mà bạn có thể dán vào thẻ <head> của trang web để tham chiếu chính xác mọi biểu tượng.

Đặc trưng

1

Bảo hiểm kích thước hoàn chỉnh

Tạo 16 x 16, 32 x 32 và 48 x 48 cho các trình duyệt truyền thống; Biểu tượng Apple Touch 180 x 180 cho iOS; 192 x 192 và 512 x 512 cho tệp kê khai PWA của Android. Mỗi kích thước phổ biến trong một lần duy nhất.

2

Đầu ra ICO và PNG

Gói này bao gồm tệp .ico có nhiều độ phân giải (chứa các lớp 16, 32 và 48 px) và các tệp PNG riêng lẻ cho từng kích thước. Cả hai định dạng đều sẵn sàng để sử dụng trực tiếp trong thẻ đầu HTML.

3

Trình chỉnh sửa cắt và đệm

Điều chỉnh vùng cắt để tách biệt phần biểu tượng của hình ảnh. Thêm phần đệm để ngăn biểu tượng chạm vào các cạnh của hình vuông favicon, giúp cải thiện mức độ dễ đọc ở kích thước nhỏ.

4

Kiểm soát nền

Giữ nền trong suốt cho các trình duyệt hiện đại hoặc đặt màu tô đồng nhất cho Biểu tượng Apple Touch (không hỗ trợ độ trong suốt). Xem trước cả hai chế độ trước khi tải xuống.

After this task

After this free tool, open Background Eraser for the next AI editing workflow.

Continue with Background Eraser

Thông số kỹ thuật

Kích thước đầu ra (px)16, 32, 48, 180, 192, 512
Định dạng đầu raICO (nhiều lớp), PNG
Định dạng đầu vàoPNG, SVG, JPEG, WebP
Đầu vào được đề xuất512 x 512 px trở lên, hình vuông
Biểu tượng cảm ứng của Apple180 x 180 px với bg đặc tùy chọn
Xử lýPhía khách hàng (không tải lên)

Related Magic Eraser Tools

Câu hỏi thường gặp

Tôi nên bắt đầu với kích thước hình ảnh nào?

+

Bắt đầu bằng hình ảnh hình vuông có kích thước tối thiểu là 512 x 512 px. Trình tạo giảm tỷ lệ so với bản chính này, do đó, nguồn có độ phân giải cao đảm bảo mọi kích thước nhỏ hơn đều sắc nét. Các tệp SVG hoạt động tốt nhất vì chúng có thể mở rộng quy mô mà không làm giảm chất lượng.

Tôi có cần tất cả sáu kích cỡ không?

+

Để có khả năng tương thích tối đa, có. ICO 16 và 32 px bao gồm các trình duyệt cũ, PNG 180 px là bắt buộc cho dấu trang Safari của iOS và PNG 192/512 px là cần thiết cho lời nhắc cài đặt PWA Android và màn hình giật gân.

Làm cách nào để thêm favicon vào trang web của tôi?

+

Gói tải xuống bao gồm một đoạn mã HTML. Dán nó vào phần <head> của trang web của bạn. Nó tham chiếu tệp ICO cho trình duyệt và tệp PNG cho thiết bị Apple và Android. Hầu hết các framework cũng hỗ trợ đặt favicon.ico trong thư mục gốc.

Logo quá phức tạp cho một favicon nhỏ?

Sử dụng Background Eraser để tách biểu tượng cốt lõi khỏi biểu tượng đầy đủ của bạn, sau đó đưa biểu tượng sạch vào trình tạo favicon. Hình dạng đơn giản hơn sẽ đọc tốt hơn ở kích thước 16 px.

Dùng thử miễn phí

More free tools

Explore our other limited free edits after sign-in photo and image tools.