Cách Hoạt Động

1

Chọn Nguồn Của Bạn

Tải lên hình ảnh, tạo từ văn bản với phông chữ tùy chỉnh, chọn từ hàng trăm biểu tượng cảm xúc, hoặc vẽ nghệ thuật pixel. Phân tích bất kỳ URL nào để trích xuất favicon hiện có.

2

Tùy chỉnh & Xem trước

Điều chỉnh nền, chuyển sắc, độ bo tròn và hiệu ứng. Xem trước favicon của bạn trong các tab trình duyệt, màn hình chính iOS, Android và các mẫu Windows trong thời gian thực.

3

Tạo & Tải xuống

Tạo tất cả các kích thước bằng một cú nhấp chuột. Tải xuống gói hoàn chỉnh với các đoạn mã sẵn sàng sử dụng cho hơn 35 framework.

Bốn Cách Để Tạo Favicon Của Bạn

Tải lên Hình ảnh

Bắt đầu với bất kỳ hình ảnh nào — PNG, JPG, SVG hoặc WebP. Thêm nền, điều chỉnh đệm, độ sáng, độ tương phản và áp dụng các góc bo tròn. Hoàn hảo cho logo và tài sản thương hiệu hiện có.

Văn bản thành Favicon

Tạo favicon dựa trên văn bản với hơn 1500 Google Fonts. Chọn độ đậm phông chữ, màu sắc và thêm nền đơn sắc hoặc chuyển sắc. Lý tưởng cho các biểu tượng thương hiệu dựa trên chữ cái đơn giản.

Favicon Biểu tượng cảm xúc

Chọn từ hàng trăm biểu tượng cảm xúc trong 12 danh mục bao gồm tất cả các cờ quốc gia. Thêm nền màu với các cài đặt trước hoặc chuyển sắc tùy chỉnh cho giao diện bóng bẩy.

Canvas Nghệ thuật Pixel

Vẽ favicon của riêng bạn từng pixel trên lưới tùy chỉnh. Sử dụng các công cụ bút, tẩy và tô màu với hỗ trợ hoàn tác/làm lại. Xuất tác phẩm nghệ thuật pixel của bạn ngay lập tức.

Tính Năng Mạnh Mẽ

100% Riêng tư

Tất cả quá trình xử lý diễn ra cục bộ trong trình duyệt của bạn. Hình ảnh của bạn không bao giờ rời khỏi thiết bị của bạn. Không tải lên, không lưu trữ đám mây, không thu thập dữ liệu.

Mọi Nền Tảng Được Bao Phủ

Tạo hơn 15 kích thước favicon cho trình duyệt, màn hình chính iOS, Chrome Android, các ô Windows, tab được ghim Safari và Ứng dụng Web Tiến bộ.

Xem trước Trực tiếp

Xem chính xác favicon của bạn trông như thế nào trong các tab trình duyệt, màn hình chính iOS, trình khởi chạy Android và các ô Windows trước khi tạo.

Đoạn mã cho 35+ Framework

Nhận mã sẵn sàng sử dụng cho HTML, React, Vue, Next.js, Nuxt, Angular, Astro, Svelte, WordPress, Shopify, Laravel, Django và hơn 25 nền tảng khác.

Trình phân tích URL

Phân tích bất kỳ trang web nào để trích xuất favicon hiện có. Xem kích thước nào có mặt, cái gì còn thiếu và tạo lại một bộ hoàn chỉnh bằng một cú nhấp chuột.

Lịch sử Tạo

Truy cập các lần tạo favicon gần đây của bạn. Khôi phục các tác phẩm trước đó, so sánh các phiên bản hoặc tiếp tục chỉnh sửa từ nơi bạn đã dừng lại.

Mẫu Nhanh

Bắt đầu với các mẫu được thiết kế chuyên nghiệp có màu đơn sắc, chuyển sắc và họa tiết. Áp dụng và tùy chỉnh để phù hợp với thương hiệu của bạn.

ICO Đa Kích Thước

Tự động tạo các tệp ICO đa độ phân giải nhúng các kích thước 16x16, 32x32 và 48x48 để tương thích tối đa với trình duyệt.

Gói Đầu ra Hoàn Chỉnh

Favicon Tiêu chuẩn

favicon.ico (đa kích thước), 16x16, 32x32 và 48x48 PNG cho các tab trình duyệt và dấu trang.

Biểu tượng Apple Touch

Biểu tượng Apple Touch 180x180 cho màn hình chính iOS, cộng với SVG tab được ghim Safari với màu chủ đề tùy chỉnh.

Biểu tượng Android & PWA

Biểu tượng 192x192 và 512x512 cho Android Chrome và Ứng dụng Web Tiến bộ, bao gồm hỗ trợ biểu tượng có thể che.

Ô Windows

Ô Microsoft 270x270 với browserconfig.xml để tích hợp menu Start Windows và thanh tác vụ.

Manifest Web

Tệp site.webmanifest hoàn chỉnh với các tham chiếu biểu tượng, màu chủ đề và cài đặt hiển thị PWA.

Câu Hỏi Thường Gặp

Tôi cần những kích thước favicon nào?
Tối thiểu: favicon.ico, 32x32 PNG, 180x180 Biểu tượng Apple Touch và 192x192/512x512 cho Android/PWA. Cài đặt trước 'Cần thiết' của chúng tôi bao gồm tất cả các kích thước cần thiết một cách tự động.
Tại sao tôi cần tệp ICO?
Định dạng ICO chứa nhiều kích thước trong một tệp và được hỗ trợ bởi tất cả các trình duyệt bao gồm cả các phiên bản cũ. Đây là định dạng favicon truyền thống đảm bảo khả năng tương thích tối đa.
Favicon của tôi có nên có nền trong suốt không?
Đối với các tab trình duyệt, độ trong suốt hoạt động tốt. Đối với màn hình chính iOS và Android, hãy xem xét nền đơn sắc hoặc chuyển sắc vì các biểu tượng xuất hiện trên nhiều hình nền khác nhau.
Hình ảnh nguồn của tôi có cần phải là hình vuông không?
Có, favicon luôn là hình vuông. Nếu hình ảnh của bạn không phải là hình vuông, hãy sử dụng các điều khiển đệm và tỷ lệ của chúng tôi để điều chỉnh nó hoàn hảo. Để có kết quả tốt nhất, hãy bắt đầu với một hình ảnh vuông.
Hình ảnh của tôi có an toàn và riêng tư không?
100% riêng tư. Tất cả quá trình xử lý sử dụng API Canvas và Blob gốc của trình duyệt. Hình ảnh của bạn không bao giờ rời khỏi thiết bị của bạn — chúng tôi không tải lên, lưu trữ hoặc truyền bất kỳ dữ liệu nào.
Những framework nào được hỗ trợ?
Chúng tôi cung cấp các đoạn mã cho hơn 35 nền tảng bao gồm React, Vue, Angular, Next.js, Nuxt, Astro, Svelte, WordPress, Shopify, Laravel, Django, Ruby on Rails và nhiều nền tảng khác.
Còn về Ứng dụng Web Tiến bộ thì sao?
Trình tạo của chúng tôi tạo tất cả các biểu tượng PWA cần thiết bao gồm các biến thể có thể che, cộng với tệp site.webmanifest hoàn chỉnh với các khai báo biểu tượng và màu chủ đề chính xác.

Hiểu về Favicon

Favicon là các biểu tượng nhỏ đại diện cho trang web của bạn trên trình duyệt, dấu trang, màn hình chính và trình khởi chạy ứng dụng. Một bộ favicon hoàn chỉnh đảm bảo thương hiệu của bạn trông chuyên nghiệp và dễ nhận biết ở bất cứ nơi nào người dùng gặp trang web của bạn.

Định dạng ICO

Định dạng ICO đóng gói nhiều kích thước (16x16, 32x32, 48x48) vào một tệp duy nhất. Trong khi các trình duyệt hiện đại hỗ trợ favicon PNG, ICO vẫn cần thiết để tương thích tối đa với các trình duyệt cũ hơn và một số ứng dụng máy tính để bàn.

Biểu tượng PNG

Các trình duyệt hiện đại thích favicon PNG vì chất lượng sắc nét và hỗ trợ độ trong suốt của chúng. Mỗi kích thước phục vụ một mục đích: 16px và 32px cho các tab trình duyệt, 180px cho iOS và 192px/512px cho Android và PWA.

Manifest Ứng dụng Web

Tệp site.webmanifest xác định cách trang web của bạn xuất hiện khi được cài đặt dưới dạng PWA. Nó chỉ định các biểu tượng, màu chủ đề, chế độ hiển thị và các siêu dữ liệu khác mà trình duyệt sử dụng để tạo trải nghiệm giống như ứng dụng.

Favicon SVG

Tính năng tab được ghim của Safari sử dụng biểu tượng SVG đơn sắc. Các trình duyệt hiện đại cũng bắt đầu hỗ trợ trực tiếp favicon SVG, cung cấp khả năng mở rộng vô hạn và kích thước tệp nhỏ hơn.