Thư viện thuật ngữ / Figma

Variable modes là gì?

Còn gọi: chế độ biến trong Figma, modes figma, light dark mode figma, styles vs variables

Variable modes là các bộ giá trị khác nhau của cùng một tập biến trong Figma, ví dụ chế độ Sáng và Tối, cho phép đổi cả giao diện bằng cách chuyển mode trên frame.

Hiểu kỹ hơn

Trong panel Local variables, mỗi collection có thể thêm nhiều cột mode, như Light và Dark, hoặc Tiếng Việt và English, hoặc Thương hiệu A và B. Mỗi biến có một giá trị cho mỗi mode, ví dụ bg/surface là trắng ở Light và xám đậm ở Dark. Khi chọn một frame và đổi mode trong phần Appearance, mọi phần tử dùng biến đó đổi theo. Phân biệt với style: style lưu cả một kiểu hoàn chỉnh (gradient, bóng đổ, bộ thuộc tính chữ) và không có mode; biến lưu một giá trị đơn và hỗ trợ mode. Cách làm hiện đại là để style tham chiếu biến. Số mode tối đa phụ thuộc gói Figma, nên có thể yêu cầu gói trả phí. Mẹo: đặt tên biến theo vai trò như text/primary, không theo màu như blue-500, để đổi mode không bị vô nghĩa.