Công cụ chuyển đổi pixel

Công cụ chuyển đổi pixel là gì?

Công cụ chuyển đổi pixel chuyển đổi giữa pixel kỹ thuật số và đơn vị độ dài thực tế (milimét, centimét, inch) ở mức DPI bất kỳ mà bạn chọn. Theo mặc định, pixel CSS giả định 96 DPI, nhưng công việc in dùng 300 DPI và in ảnh có thể đạt tới 600 DPI — ở các giá trị DPI khác nhau, cùng một số pixel sẽ tương ứng với kích thước vật lý rất khác nhau. Nhập một giá trị vào bất kỳ đơn vị nào trong bốn đơn vị, chọn cài đặt DPI phù hợp với ngữ cảnh của bạn, và ba đơn vị còn lại sẽ cập nhật theo thời gian thực. Mỗi kết quả chỉ cách clipboard một cú nhấp.

Cách dùng công cụ chuyển đổi pixel

1. Nhập giá trị bạn muốn chuyển đổi vào ô nhập — ví dụ, 100.
2. Chọn đơn vị của giá trị: pixel, milimét, centimét hoặc inch.
3. Chọn cài đặt DPI — 96 DPI cho web, 300 DPI cho in, hoặc chọn "Tùy chỉnh" để nhập DPI riêng.
4. Đọc các giá trị đã chuyển đổi cho ba đơn vị còn lại trong bảng kết quả bên dưới.
5. Nhấn Sao chép cạnh bất kỳ kết quả nào để đưa nó vào clipboard, hoặc chia sẻ URL — giá trị nhập của bạn được lưu lại dưới dạng tham số truy vấn.

Ai sử dụng công cụ chuyển đổi pixel

• Học sinh, sinh viên: Bài tập toán và vật lý liên quan đến chuyển đổi pixel sang milimét, cùng các bài tập về độ phân giải màn hình trong các môn đồ họa máy tính.
• Nhà thiết kế web & UI: Định cỡ biểu tượng, khoảng đệm và thành phần từ kích thước mockup vật lý (mm) sang pixel CSS ở DPI tham chiếu phù hợp.
• Nhà thiết kế in ấn: Chuyển bản xuất pixel từ Photoshop hoặc Figma sang milimét và inch ở 300 DPI trước khi gửi tới nhà in.
• Nhiếp ảnh gia: Tính kích thước in vật lý từ ảnh máy ảnh xuất ra (ví dụ 4000 × 3000 px ở 300 DPI in ra 13,3 × 10 inch).
• Lập trình viên: Kiểm chứng giá trị pixel CSS so với kích thước vật lý được chỉ định trong tài liệu sản phẩm hoặc tiêu chuẩn về khả năng tiếp cận.

Vì sao chọn công cụ này

• Cả bốn đơn vị (pixel, milimét, centimét, inch) cập nhật theo thời gian thực khi bạn gõ.
• Năm cài đặt DPI sẵn có bao quát các trường hợp phổ biến — 96 DPI web, 72 DPI Mac cũ, 150/300/600 DPI cho in.
• Nhập DPI tùy chỉnh cho các màn hình phi tiêu chuẩn (Retina, màn hình mật độ cao) và quy trình in chuyên biệt.
• URL có thể chia sẻ — giá trị, đơn vị nguồn và DPI của bạn được lưu lại dưới dạng tham số truy vấn.
• 100% chạy trên trình duyệt: không đăng ký, không quảng cáo trong bảng kết quả, và phép tính là mã nguồn mở.

Công cụ chuyển đổi chính xác đến mức nào?

Công cụ sử dụng tỷ lệ tiêu chuẩn 25,4 milimét trên mỗi inch và DPI bạn chỉ định, tính toán ở độ chính xác kép IEEE 754. Kết quả chính xác trong giới hạn làm tròn dấu phẩy động (sai số tương đối ≤1×10⁻⁶). Nguồn sai lệch thực tế duy nhất là chính giá trị DPI — nếu màn hình của bạn không thực sự chạy ở DPI giả định, hãy hiệu chuẩn trước bằng công cụ Screen Ruler.

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

Pixel là gì?

Pixel là đơn vị rời rạc nhỏ nhất của một màn hình hoặc hình ảnh kỹ thuật số. Kích thước vật lý của nó không cố định — nó phụ thuộc vào mật độ điểm ảnh (DPI) của màn hình. Trên màn hình web 96 DPI, một pixel chính xác bằng 1/96 inch (khoảng 0,265 mm); trên bản in 300 DPI, một pixel bằng 1/300 inch (khoảng 0,085 mm).

DPI là gì và tại sao quan trọng?

DPI (điểm trên inch) là hệ số chuyển đổi giữa pixel và độ dài vật lý. Cùng 100 px tương ứng 26,46 mm ở 96 DPI nhưng chỉ 8,47 mm ở 300 DPI. Bạn phải dùng DPI của phương tiện đích — màn hình, bản in, hay tệp xuất — để phép chuyển đổi có ý nghĩa vật lý.

Làm thế nào để chuyển pixel sang milimét?

Chia số pixel cho DPI để được inch, rồi nhân với 25,4 để được milimét: mm = (px / DPI) × 25,4. Với 100 px ở 96 DPI: 100/96 × 25,4 ≈ 26,46 mm. Công cụ thực hiện việc này theo thời gian thực.

Nên dùng 72 hay 96 DPI cho web?

Dùng 96 DPI. CSS, các trình duyệt và hệ điều hành đã chuẩn hóa 96 pixel tham chiếu trên mỗi inch từ thập niên 1990. Giá trị 72 DPI là di sản từ kiểu chữ Apple thời kỳ đầu (một pixel = một point của thợ in) và chỉ còn hữu ích cho một số tài nguyên Mac đời cũ — công việc web hiện đại giả định 96.

Nên dùng DPI nào cho in ấn?

Dùng 300 DPI cho in tạp chí và sách chất lượng cao, 150 DPI cho bản nháp và in khổ lớn, và 600 DPI chỉ dùng cho in ảnh, đường nét mỹ thuật hoặc văn bản dưới độ phóng đại lớn. Vượt 300 DPI cho công việc thông thường chỉ làm tăng kích thước tệp mà không cải thiện rõ rệt trên hầu hết các loại giấy.

Retina/HiDPI ảnh hưởng thế nào đến phép chuyển đổi?

Retina và các màn hình HiDPI khác render hai hoặc ba pixel vật lý cho mỗi pixel CSS. Theo mặc định, công cụ làm việc với pixel CSS, do đó 100 px CSS ở 96 DPI là đúng cho mọi màn hình HiDPI. Nếu bạn cần số pixel vật lý, hãy nhân với tỷ lệ pixel của thiết bị (window.devicePixelRatio trong trình duyệt).

Tại sao thiết kế web của tôi trông nhỏ hơn trên màn hình 4K?

Hầu hết hệ điều hành chạy màn hình 4K ở mức tỷ lệ 150–200%, giữ cho pixel CSS trông tương tự như trên màn hình 1080p. Nếu tỷ lệ tắt, thiết kế của bạn sẽ trông nhỏ hơn về vật lý vì cùng số pixel chiếm ít inch thực tế hơn. Hãy điều chỉnh tỷ lệ DPI trong cài đặt hệ điều hành, hoặc dùng đơn vị rem/percent thay vì px cố định.

Đào sâu DPI — chọn đúng con số một lần duy nhất

Mọi phép chuyển đổi pixel sang chiều dài chỉ là một phương trình: chiều dài = pixel ÷ DPI. Phần khó là chọn DPI khớp với phương tiện mà đầu ra của bạn sẽ tồn tại. DPI sai không báo lỗi — nó âm thầm tạo ra con số đúng về toán học và sai về vật lý. Các thiết lập sẵn dưới đây bao quát 95% công việc thực tế.

Công việc web — luôn dùng 96 DPI

CSS, trình duyệt và hệ điều hành được chuẩn hóa ở 96 pixel tham chiếu trên một inch vào cuối thập niên 1990 và con số đó vẫn không đổi. Mọi trình duyệt hiện đại đều coi 1 pixel CSS là 1/96 inch bất kể màn hình vật lý. Màn hình Retina và 4K render ở mật độ vật lý cao hơn nhưng OS sẽ co pixel CSS về tham chiếu 96 DPI, nên phép tính của bạn vẫn hợp lệ. Coi 72 DPI là di sản — nó chỉ quan trọng nếu bạn lấy tài nguyên từ máy Mac trước OS X.

Công việc in — 150, 300, hoặc 600 DPI

Phần lớn tạp chí, sách và bản in ảnh tiêu dùng dùng 300 DPI. Hạ xuống 150 DPI cho bản nháp và in khổ lớn nơi khoảng cách nhìn che giấu mất mát độ phân giải; nó cắt nửa dung lượng tệp và vẫn sắc nét từ một mét. Chỉ tăng lên 600 DPI khi bản in sẽ được kiểm tra gần — line art tinh xảo, bản vẽ kỹ thuật, văn bản nhỏ trên giấy bóng. Vượt 600 DPI gần như không cải thiện chất lượng nhìn thấy được và lãng phí ổ đĩa.

Retina và HiDPI — làm việc theo pixel CSS

Màn hình Retina render hai hoặc ba pixel vật lý cho mỗi pixel CSS, nhưng OS che điều này khỏi mã của bạn. Hãy bám vào pixel CSS (96 DPI) cho phép tính layout. Nếu bạn cần số pixel vật lý thực — ví dụ khi giao tài nguyên bitmap phải sắc nét trên mọi thiết bị — hãy nhân với window.devicePixelRatio lúc runtime và giao biến thể @2x hoặc @3x. Bộ chuyển đổi pixel mặc định coi đầu vào là pixel CSS; chỉ tick ô Custom DPI khi bạn thực sự đã đo mật độ pixel vật lý của một màn hình đã biết.

Các mẫu chuyển đổi phổ biến

Một số giá trị pixel xuất hiện nhiều đến mức đáng để nhớ. Bảng dưới cho thấy 100 px, 1000 px và chiều rộng Full HD điển hình (1920 px) chuyển thành gì ở bốn giá trị DPI phổ biến nhất.

Mẹo thực hành cho lập trình viên

Xác minh trong DevTools trước

Trước khi tin tưởng một phép chuyển đổi, hãy xác nhận trình duyệt đang báo cáo 96 DPI tham chiếu bằng cách gõ window.matchMedia('(min-resolution: 96dpi)').matches vào console. Trên hệ thống cấu hình đúng, lệnh này trả về true. Nếu trả về false, mức zoom hoặc tỉ lệ OS của bạn không mặc định và phép chuyển đổi cần điều chỉnh.

Luôn xuất ở DPI mục tiêu

Photoshop, Figma và phần lớn công cụ thiết kế mặc định xuất ở DPI của canvas. Đặt DPI canvas bằng phương tiện mục tiêu trước khi xuất — xuất canvas 96 DPI ở 300 DPI không thực sự upsample hình ảnh; nó chỉ gán lại metadata và in ra với một phần ba kích thước vật lý dự kiến.

Hiệu chuẩn màn hình để có chân lý cơ sở

Nếu công việc của bạn phụ thuộc vào độ chính xác vật lý — đo vật cầm tay áp vào màn hình, lấy kích thước icon theo chiều rộng thẻ tín dụng đã biết — hãy mở Screen Ruler và hiệu chuẩn theo thẻ tín dụng thật trước. DPI thực tế của màn hình hiếm khi khớp với bảng thông số; hiệu chuẩn neo phép chuyển đổi vào thực tế vật lý.