Softonic

Trình chuyển đổi favicon

Tạo các tệp cần thiết để thêm favicon vào trang web từ một ảnh raster. Chọn cách đặt ảnh nguồn trên khung vuông, đặt nền rồi tải xuống tệp ZIP gồm ICO đa kích thước, 7 biểu tượng PNG, manifest ứng dụng web, cấu hình ô Windows và đoạn HTML dùng cho phần head có thể sao chép ngay. Quá trình chuyển đổi ảnh và tạo ZIP diễn ra cục bộ trong trình duyệt của bạn.

Cách chuyển ảnh thành bộ favicon

  1. 1

    Chọn ảnh raster

    Chọn PNG, JPEG hoặc WebP đáp ứng giới hạn dung lượng tệp và kích thước ảnh được hiển thị. Không chấp nhận tệp SVG, GIF và AVIF.

  2. 2

    Chọn cách căn ảnh

    Dùng Lấp đầy và cắt để phủ kín hình vuông rồi cắt các cạnh, hoặc Vừa khung và thêm khoảng đệm để giữ toàn bộ ảnh và tạo khoảng trống xung quanh.

  3. 3

    Đặt nền

    Chọn màu nền cho các điểm ảnh trong suốt và khoảng đệm do chế độ Vừa khung và thêm khoảng đệm tạo ra, sau đó xem các bản xem trước.

  4. 4

    Tải xuống và cài đặt

    Tải ZIP xuống, đặt các tệp biểu tượng và cấu hình lên trang web, rồi sao chép các thẻ link được cung cấp vào phần head của tài liệu.

Nội dung của tệp ZIP

Mục trong bộ tệp Mục đích
favicon.ico Một vùng chứa ICO có các mục 16, 32, 48 và 256 px cho trình duyệt và phần mềm yêu cầu đường dẫn favicon truyền thống
favicon-16x16.png PNG nhỏ gọn cho tab trình duyệt và các vị trí hiển thị nhỏ khác
favicon-32x32.png Biểu tượng mật độ cao hơn cho tab trình duyệt và dấu trang
favicon-48x48.png Kích thước bổ sung cho màn hình nền và lối tắt
mstile-150x150.png PNG 150 x 150 được cấu hình ô Windows tham chiếu
apple-touch-icon.png PNG 180 x 180 cho liên kết trên màn hình chính của Apple
android-chrome-192x192.png Biểu tượng ứng dụng 192 x 192 được manifest ứng dụng web tham chiếu
android-chrome-512x512.png Biểu tượng ứng dụng 512 x 512 được manifest ứng dụng web tham chiếu
site.webmanifest Siêu dữ liệu JSON trỏ trình duyệt tương thích đến các biểu tượng 192 px và 512 px
browserconfig.xml Cấu hình ô Windows tham chiếu các tài nguyên biểu tượng đã tạo
favicon-head.html Các thẻ sẵn sàng sao chép để liên kết trang với ICO, PNG, biểu tượng Apple, manifest và cấu hình trình duyệt

Các tệp ICO và PNG được tách riêng có chủ đích. Trình duyệt và hệ điều hành chọn biểu tượng theo những cách khác nhau, vì vậy một bộ đầy đủ đáp ứng cả yêu cầu /favicon.ico truyền thống lẫn các khai báo biểu tượng hiện đại rõ ràng.

Các thẻ trong phần head của HTML

Bộ tệp tải xuống có đoạn mã ở dạng sau:

<link rel="icon" href="/favicon.ico" sizes="any">
<link rel="icon" type="image/png" sizes="32x32" href="/favicon-32x32.png">
<link rel="icon" type="image/png" sizes="16x16" href="/favicon-16x16.png">
<link rel="apple-touch-icon" sizes="180x180" href="/apple-touch-icon.png">
<link rel="manifest" href="/site.webmanifest">
<meta name="msapplication-config" content="/browserconfig.xml">

Nếu các tệp nằm trong thư mục con hoặc trên một máy chủ tài nguyên riêng, hãy sửa đường dẫn trước khi dán các thẻ vào <head>. Giữ tên tệp và đường dẫn bên trong site.webmanifest cùng browserconfig.xml khớp với các tệp bạn triển khai.

Chọn lấp đầy, vừa khung và nền

  • Lấp đầy và cắt phủ kín mọi đầu ra hình vuông. Ảnh nguồn rộng hoặc cao sẽ bị cắt đều ở hai cạnh đối diện, vì vậy hãy đặt phần hình quan trọng gần tâm.
  • Vừa khung và thêm khoảng đệm giữ nguyên toàn bộ ảnh nguồn. Khoảng trống còn lại trở thành vùng đệm theo màu nền đã chọn.
  • Nền có thể giữ trong suốt hoặc dùng một màu đơn tùy chỉnh. Ở chế độ Vừa khung và thêm khoảng đệm, lựa chọn này cũng quyết định màu vùng đệm quanh ảnh. Hãy kiểm tra bản xem trước trên cả giao diện trang sáng và tối trước khi xuất bản.

Để các biểu tượng nhỏ sắc nét nhất, hãy bắt đầu bằng ảnh vuông đơn giản có kích thước ít nhất 512 x 512 pixel. Chữ mảnh, nét rất nhỏ và chi tiết li ti có thể biến mất trong phiên bản 16 px ngay cả khi ảnh nguồn lớn.

Giới hạn đầu vào và vị trí tệp

Trình chuyển đổi này chỉ nhận ảnh raster PNG, JPEG và WebP. Công cụ kiểm tra chữ ký của ảnh và từ chối SVG, GIF, AVIF cùng các định dạng khác không được liệt kê. Mỗi ảnh nguồn có thể có dung lượng tối đa 20 MiB, mỗi cạnh không dài quá 8.192 pixel và tổng độ phân giải không vượt quá 24 megapixel. Kích thước được kiểm tra trước khi toàn bộ ảnh được giải mã.

Sau khi tải xuống, hãy giải nén ZIP và tải các tệp đã tạo lên những đường dẫn mà đoạn mã cung cấp sử dụng. Đường dẫn tương đối từ gốc như /favicon.ico giả định rằng tệp có thể truy cập từ thư mục gốc của tên miền hiện tại. Hãy xóa bộ nhớ đệm của trang web hoặc CDN khi thay favicon cũ, vì trình duyệt thường giữ tệp biểu tượng lâu hơn tài nguyên trang thông thường.

Manifest đi kèm cung cấp siêu dữ liệu biểu tượng, nhưng chỉ manifest và bộ biểu tượng không đủ để biến trang web thành ứng dụng web tiến bộ có thể cài đặt. Khả năng cài đặt còn phụ thuộc vào trang, bảo mật truyền tải và yêu cầu của từng trình duyệt.

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

Bạn có thể dùng PNG, JPEG hoặc WebP. Trình chuyển đổi kiểm tra chữ ký tệp thay vì chỉ tin vào tên tệp, đồng thời từ chối SVG, GIF, AVIF và các định dạng khác.

Lấp đầy và cắt phóng ảnh cho đến khi kín hình vuông, rồi cắt đều các cạnh đối diện nếu tỷ lệ ảnh không vuông. Vừa khung và thêm khoảng đệm giữ toàn bộ ảnh rồi tô phần còn lại của hình vuông bằng màu nền đã chọn.

ICO là vùng chứa có thể lưu nhiều kích thước biểu tượng nhỏ trong một tệp favicon truyền thống. Các tệp PNG riêng cung cấp tài nguyên có kích thước rõ ràng cho trình duyệt và nền tảng để dùng trên tab, liên kết màn hình chính và biểu tượng ứng dụng. Giữ cả hai giúp mở rộng khả năng tương thích trong thực tế.

Không. Manifest mô tả các biểu tượng ứng dụng đã tạo và siêu dữ liệu hiển thị liên quan, nhưng khả năng cài đặt phụ thuộc vào các yêu cầu bổ sung của trình duyệt cũng như cách trang web được xây dựng và phân phối.

Đoạn mã được cung cấp dùng đường dẫn tương đối từ gốc, nên cách đơn giản nhất là đặt các tệp đã giải nén ở thư mục gốc của tên miền. Nếu dùng thư mục hoặc máy chủ tài nguyên khác, hãy cập nhật đoạn mã cùng các đường dẫn trong manifest và cấu hình trình duyệt.

Không. Quá trình xử lý ảnh và tạo ZIP diễn ra trong trình duyệt. Ở quy trình nhiều bước, một bản nháp IndexedDB có thể giữ ảnh trong trình duyệt này tối đa 30 phút để chuyển ảnh giữa các bước. Việc chuyển cục bộ đó không phải là tải lên máy chủ.

Công cụ liên quan

Trình đổi kích thước ảnh

Đổi kích thước ảnh theo số pixel chính xác hoặc theo phần trăm mà vẫn giữ tỷ lệ khung hình. Phù hợp để chuẩn bị nhiều ảnh, không cần tải lên.

Nén GIF

Giảm kích thước GIF động trong trình duyệt bằng cách thu nhỏ kích thước, giữ ít khung hình hơn và chỉnh chất lượng mã hóa. Xem trước vòng lặp trước khi tải xuống.

Chuyển WebP sang JPG

Chuyển ảnh WebP sang JPG/JPEG trực tiếp trong trình duyệt. Chọn chất lượng, ghép vùng trong suốt vào màu nền và tải xuống mà không cần tải tệp lên.

Trình thay đổi kích thước ảnh hàng loạt

Kéo thả nhiều ảnh, căn vừa hoặc kéo giãn theo kích thước mục tiêu, rồi xuất JPG, PNG hoặc WebP trong một file ZIP. Mọi xử lý ở lại trong trình duyệt.

Trình tạo mã vạch

Tạo mã vạch 1D quét được ở Code 128, Code 39, EAN-13, UPC-A, ITF-14 và Codabar. Xuất PNG, SVG hoặc PDF để in.

Trình tạo GIF

Chuyển chuỗi ảnh hoặc video ngắn thành GIF động. Điều chỉnh tốc độ khung hình, số vòng lặp và kích thước trước khi xuất.