Máy tính tỷ lệ vàng

Hướng dẫn Tỷ lệ Vàng

Tỷ lệ vàng (φ ≈ 1.618033) là một tỷ lệ có trong tự nhiên — từ vỏ ốc anh vũ đến đường xoắn hoa hướng dương — và được dùng trong nghệ thuật và thiết kế hàng nghìn năm. Các hình dạng xây trên tỷ lệ 1:1.618 trông cân bằng tự nhiên, vì thế tỷ lệ này xuất hiện ở đền Parthenon, bức Mona Lisa và các lưới logo hiện đại.

Nhập bất kỳ giá trị nào để tìm cặp vàng của nó: chia cho φ được giá trị đồng hành nhỏ hơn, nhân với φ được giá trị lớn hơn. Dùng kết quả cho chiều rộng bố cục, thang tỷ lệ chữ (kết hợp công cụ Thang tỷ lệ chữ với 1.618), cắt ảnh và tỷ lệ logo. Bản xem trước vẽ hình chữ nhật vàng cổ điển với các phân chia xoắn ốc.

Pro Tips

• Với bố cục web, dùng tỷ lệ vàng cho chiều rộng nội dung-thanh bên: cột chính × φ : thanh bên, ví dụ nội dung 960px với thanh bên 593px.
• Kết hợp tỷ lệ vàng với thang tỷ lệ chữ 1.618 để có hệ thống thiết kế hài hòa hoàn toàn — kích thước tiêu đề, chiều cao dòng và khoảng cách đều xuất phát từ cùng một hằng số.

Tỷ lệ vàng là gì

Tỷ lệ vàng là số vô tỉ φ (phi), xấp xỉ 1,6180339887. Hai đại lượng ở tỷ lệ vàng khi tổng của chúng chia cho số lớn bằng số lớn chia cho số bé: (a+b)/a = a/b. Tỷ lệ này xuất hiện khắp nghệ thuật và tự nhiên — từ đền Parthenon và các bức vẽ của Leonardo da Vinci đến vỏ ốc anh vũ và đường xoắn hạt hướng dương — và các nhà thiết kế dùng nó như công thức có sẵn cho bố cục cân bằng, tự nhiên.

Tỷ lệ vàng trong thiết kế

Nhà thiết kế dùng 1,618 để chia không gian thành phần chủ đạo và phần hỗ trợ. Mẫu phổ biến là chia nội dung-thanh bên: cột chính 960px đi kèm thanh bên 593px (960 ÷ 1,618 ≈ 593). Cách chia tương tự áp dụng cho chiều cao phần hero, tỷ lệ ảnh-chữ trong thẻ và hình học logo. Vì tỷ lệ này tự lặp lại ở mọi quy mô — phần lớn liên hệ với tổng thể giống như phần nhỏ liên hệ với phần lớn — nên bố cục xây trên nó trông tĩnh tại và có chủ đích.

Hình chữ nhật vàng và đường xoắn vàng

Hình chữ nhật vàng có các cạnh tỷ lệ 1:1,618. Cắt đi hình vuông lớn nhất có thể, phần còn lại vẫn là hình chữ nhật vàng — tính chất này lặp lại mãi mãi. Vẽ các phần tư đường tròn qua chuỗi hình vuông ta được đường xoắn vàng, mỗi phần tư vòng lại lớn thêm φ lần. Nhà thiết kế dùng đường xoắn làm chỉ dẫn thị giác: đặt tiêu điểm của poster, bìa hoặc ảnh hero ở chỗ đường xoắn siết lại sẽ dẫn mắt theo lối tự nhiên.

Liên hệ với dãy Fibonacci

Dãy Fibonacci (1, 1, 2, 3, 5, 8, 13, 21, 34...) hội tụ về tỷ lệ vàng: chia bất kỳ số hạng nào cho số trước nó sẽ ra các số ngày càng gần 1,618 (21/13 ≈ 1,615, 34/21 ≈ 1,619). Vì thế hai thứ được coi như anh em sinh đôi trong thiết kế: lưới, bậc khoảng cách và cả cỡ chữ dựa trên Fibonacci đều là xấp xỉ thực dụng của tỷ lệ vàng, và dãy số cho bạn những số nguyên tiện dùng.

Áp dụng 1,618 vào bố cục của bạn

Bắt đầu từ một số đo cụ thể — chiều rộng khung chứa, cỡ tiêu đề hay số cột — rồi nhân hoặc chia cho 1,618 để ra các giá trị đi kèm. Với hệ khoảng cách, xếp dãy số: 8, 13, 21, 34, 55px cho năm bậc hài hòa. Dùng máy tính này để tìm cặp vàng cho bất kỳ giá trị nhập nào, rồi áp các con số vào chiều rộng, chiều cao, lề và cỡ chữ để mọi yếu tố trong bố cục chia sẻ cùng một tỷ lệ nền.