Công cụ thêm văn bản vào hình ảnh

Từ chú thích hình ảnh dạng meme đến thẻ trích dẫn, biểu ngữ truyền cảm hứng và nhãn sản phẩm – văn bản trên hình ảnh chính là cách tạo ra phần lớn nội dung mạng xã hội. Bạn chỉ cần tải lên một bức ảnh, thêm một hoặc nhiều lớp văn bản với các phông chữ, màu sắc và vị trí riêng biệt; công cụ này sẽ hiển thị kết quả ở độ phân giải đầy đủ, kèm theo đường viền, bóng đổ, nền hình và căn chỉnh văn bản tại mọi góc.

Cách thêm văn bản vào hình ảnh

  1. 1

    Tải lên hình ảnh

    JPG, PNG, WebP.

  2. 2

    Thêm lớp văn bản

    Nhập văn bản của bạn; kéo để đặt vị trí; thay đổi kích thước bằng các thanh góc.

  3. 3

    Phong cách

    Chọn phông chữ (phông hệ thống hoặc Google Fonts), kích thước, màu sắc, viền và bóng đổ.

  4. 4

    Thêm thêm các lớp

    Đặt chồng nhiều ô văn bản để tạo các meme nhiều dòng hoặc ảnh có chú thích.

  5. 5

    Xuất

    Được hiển thị trên hình ảnh ở độ phân giải nguồn đầy đủ.

Các quy tắc thiết kế văn bản trên hình ảnh

Văn bản có thể đọc được trên mọi hình ảnh

Ba kỹ thuật giúp văn bản vẫn dễ đọc ngay cả khi nền có nhiều yếu tố phức tạp:

  1. Vạch viền rõ nét: văn bản màu trắng với viền đen dày 2–3 pixel sẽ hiển thị rõ trên mọi hình ảnh.
  2. Viên nền chắc: hình chữ nhật hoặc hình chữ nhật tròn đặt phía sau văn bản với độ đục từ 60 đến 80%.
  3. Giảm độ đậm màu cục bộ: áp dụng một vùng tối có viền mềm chỉ phía sau văn bản.

Các định dạng meme

Định dạng Vị trí văn bản Phông chữ tiêu chuẩn
Meme dạng trên-dưới Văn bản trắng ở phần trên và dưới với viền đen Thể chữ Impact, đậm sans
Thẻ trích dẫn Đặt ở giữa, cỡ lớn, kiểu chữ có viền hoặc kiểu hiển thị Playfair, Merriweather
Tiêu đề câu chuyện trên Instagram Hình nền dạng viên thuốc ở phía dưới Phông chữ System Sans
Băng chuyền ảnh LinkedIn Góc trên bên trái, chữ sans-serif sạch sẽ Inter, Helvetica
Ảnh chụp màn hình từ Twitter được hiển thị chồng lên Trung tâm với bóng đổ tinh tế chữ serif dùng để thể hiện sự mỉa mai; chữ sans dùng để thể hiện sự thẳng thắn

Các nguồn chữ

  • Các phông chữ hệ thống: không mất thời gian tải, đảm bảo hiển thị chính xác.
  • Google Fonts: thư viện lớn, tải đồng thời (async).
  • Tải lên WOFF2 tùy chỉnh: dành cho kiểu chữ riêng biệt của thương hiệu.

Giữ cho bố cục có khoảng thở

  • Không đặt văn bản lên mọi phần của hình ảnh.
  • Hãy chừa ít nhất 10% khoảng trống xung quanh văn bản so với mép hình ảnh.
  • Đối với các bài đăng mạng xã hội dạng vuông, nguyên tắc “một phần ba” cũng áp dụng cho vị trí đặt văn bản.

Kích thước xuất

Hầu hết các nền tảng xã hội đều sẽ mã hóa lại hình ảnh của bạn. Hãy xuất hình ảnh ở kích thước gấp đôi kích thước hiển thị cuối cùng và để nền tảng tự điều chỉnh kích thước xuống; kết quả sẽ sắc nét hơn so với việc tải lên ở kích thước mục tiêu chính xác.

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

Vâng – chỉ cần tải lên tệp WOFF, WOFF2 hoặc TTF là nó sẽ được đăng ký cho phiên làm việc hiện tại. Các phông chữ riêng biệt của từng thương hiệu sẽ hoạt động ngay lập tức; không có dữ liệu nào khác được truyền ra ngoài trình duyệt.

Hãy kết hợp đường viền dày (đường đen 2–3 pixel trên văn bản trắng) với hiệu ứng bóng mềm, hoặc đặt văn bản bên trong một hình chữ nhật bán trong suốt. Luôn kiểm tra lại ở kích thước hiển thị thực tế: những dòng chữ trông ổn khi phóng to có thể biến mất hoàn toàn trên nền phức tạp khi ở kích thước ảnh thu nhỏ.

Đúng vậy, khi sử dụng phông chữ emoji màu sắc của hệ thống, các biểu tượng được hiển thị sẽ giống hệt phiên bản trong hệ điều hành của bạn; hình ảnh xuất ra đã tích hợp các ký tự này sẵn, do đó sẽ hiển thị đồng nhất trên mọi thiết bị xem.

Đúng vậy. Mỗi lớp văn bản đều có khả năng xoay và nghiêng độc lập, rất phù hợp với các biểu tượng bán hàng dạng chéo hoặc nhãn trên khung bên dọc.

Công cụ liên quan

Công cụ này có phiên bản bằng các ngôn ngữ khác