Cách cắt ảnh thành hình tròn (Ảnh đại diện và Avatar)

Cập nhật lần cuối: June 28, 2026

Khung cắt hình tròn biến một bức ảnh vuông hoặc chữ nhật thành hình tròn — kiểu dáng tiêu chuẩn cho avatar, ảnh hồ sơ và logo. Có hai mục tiêu riêng biệt: là một file PNG hình tròn trong suốt (dùng cho thiết kế) hoặc là hình tròn trên nền màu đặc (cho avatar đã hoàn thiện). Hướng dẫn này sẽ đề cập đến cả hai, quy tắc ưu tiên khung vuông giúp giữ chủ thể ở vị trí trung tâm, và nơi thực tế mà việc cắt ảnh thành hình tròn được sử dụng.

Câu trả lời nhanh: làm thế nào để cắt ảnh thành hình tròn?

Quy tắc quan trọng: hãy cắt thành khung vuông trước và đặt chủ thể ở vị trí trung tâm, sau đó mới áp dụng hình tròn — nếu không, chủ thể sẽ bị lệch khỏi tâm trong vòng tròn.

Quy tắc khung vuông trước

Hầu hết mọi người đều cố gắng cắt thẳng thành hình tròn và nhận thấy chủ thể bị lệch sang một bên. Cách khắc phục là phải cắt thành khung vuông căn giữa trước, sau đó mới làm nó thành hình tròn. Khung vuông đảm bảo rằng chủ thể nằm ở vị trí trung tâm của vòng tròn cuối cùng.

Đối với khuôn mặt, hãy căn giữa trên mắt và mũi, chứ không phải toàn bộ đầu, bởi vì hình tròn sẽ cắt mất các góc nơi viền của đầu. Hãy chừa lại một khoảng trống nhỏ để cằm và trán không bị cắt.

Hình cắt tròn được sử dụng ở đâu?

Khung cắt hình tròn là kiểu dáng tiêu chuẩn cho một vài mục đích cụ thể:

• Avatar và ảnh hồ sơ — hầu hết các nền tảng mạng xã hội đều tự động mask (che mặt nạ) bức ảnh vuông tải lên thành hình tròn.
• Logo — nhiều thương hiệu đặt dấu ấn của mình trong một vòng tròn cho biểu tượng ứng dụng và favicon.
• Ảnh đội nhóm và lời chứng thực — ảnh chân dung tròn trên các trang giới thiệu về công ty và widget đánh giá.
• Các yếu tố UI — nút bấm và huy hiệu hình tròn.

Đối với ảnh hồ sơ mạng xã hội, bạn thường không cần tự tạo hình tròn — chỉ cần tải lên một bức ảnh vuông đã căn giữa và nền tảng sẽ tự mask nó. Chỉ nên tự tạo hình tròn khi bạn cần một hình ảnh tròn hoàn thiện cho thiết kế hoặc in ấn.

Làm thế nào để chọn phương pháp?

Phương pháp 1: PNG hình tròn trong suốt

Một hình tròn trong suốt giữ được hình dạng tròn với các góc minh bạch, vì vậy nó có thể đặt lên bất kỳ nền nào. Xuất dưới dạng PNG (JPEG không hỗ trợ alpha).

## Crop to a centered 600x600 square, then apply a circular alpha mask
magick input.jpg -gravity center -crop 600x600+0+0 +repage \
  \( +clone -threshold -1 -negate -fill white -draw "circle 300,300 300,0" \) \
  -alpha copy -compose CopyOpacity -composite output.png

Kết quả là một file PNG với các góc trong suốt. Sử dụng nó để ghép thiết kế (compositing) trong bố cục; xem cách tạo hình ảnh trong suốt.

Phương pháp 2: Hình tròn trên nền màu đặc

Đối với avatar hoàn thiện, hãy ghép hình tròn lên một màu nền đặc (trắng, màu thương hiệu hoặc đen). Đây là những gì hầu hết các công cụ "ảnh hồ sơ tròn" xuất ra.

## Circle on a light-blue background
magick -size 600x600 "xc:#e8f0fe" bg.png
magick bg.png circle.png -gravity center -compose over -composite output.jpg

Chọn màu nền tương phản với chủ thể. Trắng là mặc định an toàn; màu thương hiệu phù hợp với bộ avatar doanh nghiệp.

Phương pháp 3: Hình tròn CSS (không chỉnh sửa ảnh)

Đối với một trang web, bạn không cần cắt ảnh chút nào — CSS sẽ mask một khung vuông thành hình tròn:

.avatar { width: 200px; height: 200px; border-radius: 50%; object-fit: cover; }

border-radius: 50% biến bất kỳ phần tử vuông nào thành hình tròn; object-fit: cover giữ cho ảnh lấp đầy nó mà không bị méo. Đây là cách hầu hết các trang web hiển thị avatar từ một nguồn ảnh vuông. Tài liệu tham khảo border-radius của MDN mô tả thuộc tính này.

Phương pháp 4: Công cụ trình duyệt

Đối với một bức ảnh, hãy sử dụng Image Resizer hoặc công cụ cắt hình tròn: tải lên, định vị chủ thể trong khung vuông, áp dụng hình tròn và tải xuống. Điều này xử lý quy tắc khung vuông trước bằng phương pháp trực quan.

Bạn nên tự tạo hình tròn hay để nền tảng làm?

Đối với ảnh hồ sơ mạng xã hội, hãy để nền tảng làm — chỉ cần tải lên một bức ảnh vuông đã căn giữa và nền tảng sẽ mask nó thành hình tròn. Việc tự tạo hình tròn có thể thực sự gây hại, bởi vì một số nền tảng mong đợi một khung vuông và sẽ re-mask (tái mask) hình tròn của bạn thành một vòng tròn nhỏ hơn, cắt thêm nữa. Chỉ nên tự tạo hình tròn khi bạn cần một hình ảnh tròn hoàn thiện cho thiết kế, in ấn hoặc avatar mà sẽ không bị re-mask.

Sự khác biệt này khiến mọi người bối rối vì các nền tảng khuyến khích sự nhầm lẫn — chúng hiển thị ảnh của bạn dưới dạng hình tròn trong giao diện người dùng (UI), khiến người dùng mặc định rằng họ phải tải lên một hình tròn. Trên thực tế, trường tải lên hầu như luôn yêu cầu một khung vuông; việc hiển thị hình tròn là một lớp mask CSS được áp dụng bên trên. Tải lên một ảnh đã được cắt thành hình tròn có nghĩa là mask của nền tảng sẽ cắt vào chủ thể của bạn lần thứ hai, tạo ra một khung cắt nhỏ hơn và bó hẹp hơn so với ý định ban đầu của bạn. Lựa chọn an toàn nhất là tải lên một khung vuông căn giữa rộng rãi với khuôn mặt của chủ thể nằm ở phần ba trung tâm, để bất kỳ hình tròn nào mà nền tảng áp dụng vẫn chứa toàn bộ khuôn mặt cùng với một khoảng trống nhỏ.

Những lỗi thường gặp

• Cắt thẳng thành hình tròn. Chủ thể bị lệch khỏi tâm. Phải vuông trước.
• Căn giữa cả cái đầu, chứ không phải khuôn mặt. Hình tròn sẽ cắt mất các góc; hãy căn giữa trên mắt/mũi.
• Xuất hình tròn trong suốt dưới dạng JPEG. JPEG không có alpha; các góc sẽ chuyển thành màu đen hoặc trắng. Hãy dùng PNG.
• Tự tạo hình tròn cho ảnh hồ sơ mạng xã hội. Nền tảng sẽ re-mask; hãy tải lên khung vuông căn giữa thay thế.
• Cắt mất cằm hoặc trán. Hãy chừa khoảng trống bên trong vòng tròn.

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

Làm cách nào để tôi có một ảnh hồ sơ hình tròn?

Hãy cắt thành khung vuông căn giữa với khuôn mặt ở vị trí trung tâm, sau đó hoặc là để nền tảng mask nó, hoặc áp dụng việc cắt hình tròn cho một hình ảnh tròn hoàn thiện.

Tôi có nên cắt thành hình tròn cho mạng xã hội không?

Thông thường là không — hãy tải lên một khung vuông căn giữa và nền tảng sẽ mask nó thành hình tròn. Tự tạo hình tròn có thể bị re-crop (cắt lại).

Định dạng nào là hình tròn trong suốt?

PNG. JPEG không có kênh alpha, vì vậy các góc trong suốt không thể được lưu trữ. Xem hình ảnh trong suốt.

Làm thế nào để tôi đặt ảnh hình tròn lên nền màu khác?

Tạo một PNG hình tròn trong suốt, sau đó ghép nó lên màu nền đặc — hoặc sử dụng CSS border-radius: 50% trên trang web.

Tôi cắt ảnh thành hình tròn như thế nào?

Trước tiên hãy cắt thành khung vuông (hình tròn chỉ vừa vặn trong một canvas vuông), sau đó áp dụng mặt nạ hình tròn. Xuất dưới dạng PNG để giữ các góc minh bạch, hoặc đặt hình tròn trên nền màu đặc và xuất dưới dạng JPG. Quy tắc vuông trước là không thể thương lượng — hình tròn trong canvas không vuông sẽ để lại các góc khó coi.

Tại sao tôi phải cắt thành khung vuông trước?

Bởi vì một hình tròn chỉ vừa vặn bên trong một canvas vuông. Áp dụng mặt nạ hình tròn lên ảnh không vuông sẽ để lại các góc không minh bạch, giữ nguyên bất kỳ hình dạng nào của canvas. Cắt thành khung vuông trước, với chủ thể căn giữa, có nghĩa là hình tròn được khắc gọn gàng và kết quả là một hình ảnh tròn không có góc thừa.

Ảnh hồ sơ nên kích thước bao nhiêu?

Khoảng 400×400 đến 800×800 pixels — đủ lớn để sắc nét, đủ nhỏ để tải nhanh. Hãy cắt thành khung vuông trước, sau đó áp dụng hình tròn. Hầu hết các nền tảng sẽ giảm kích thước ảnh tải lên lớn hơn, vì vậy 800px là giới hạn an toàn. Xem công cụ cắt ảnh.

Tôi có thể cắt một ảnh không vuông thành hình tròn không?

Chỉ bằng cách cắt thành khung vuông trước — vì hình tròn chỉ vừa vặn trong canvas vuông, nên ảnh không vuông sẽ để lại các góc khó coi. Luôn luôn cắt thành khung vuông trước với chủ thể căn giữa, sau đó áp dụng hình tròn. Quy tắc khung vuông trước là bắt buộc đối với việc cắt hình tròn sạch sẽ.

Làm thế nào để giữ cho hình cắt tròn sắc nét?

Xuất ở kích thước gấp 2 lần kích thước hiển thị (ví dụ: 800px cho màn hình 400px) để hình tròn luôn sắc nét trên màn hình retina, và sử dụng PNG để bảo toàn các góc trong suốt mà không mất chất lượng. Một hình tròn 1x trên màn hình DPI cao sẽ trông mềm mại. Các cạnh trong suốt đặc biệt được hưởng lợi từ PNG hơn JPEG, vì JPEG không có kênh alpha.

Hình cắt tròn được sử dụng ở đâu?

Ảnh hồ sơ và avatar trên hầu hết mọi nền tảng — mạng xã hội, email, ứng dụng, diễn đàn. Chúng là mặc định cho nhận dạng người dùng, đó là lý do tại sao một ảnh nguồn vuông căn giữa chủ thể lại cắt gọn gàng thành hình tròn. Hãy khớp kích thước xuất với thông số avatar của nền tảng, thường là 400–800px.

Nguồn ảnh

• Sơ đồ demo cắt hình tròn, quy tắc vuông rồi thành tròn và các trường hợp sử dụng khung cắt hình tròn — do tác giả tạo từ một bức ảnh phong cách thương mại điện tử (Pexels #16675632, ảnh của Mikael Blomkvist) để minh họa kết quả cắt hình tròn thực tế và quy tắc vuông trước.