Thông thường, các màu dùng cho website hoặc ứng dụng sẽ được định nghĩa sẵn rồi sử dụng.
Việc quyết định một bảng màu có cùng độ sáng và độ bão hòa, chỉ khác nhau về sắc độ (Hue), không quá khó.
Tuy nhiên, có những trường hợp cần nhiều cấp độ sáng khác nhau trong khi độ bão hòa và sắc độ vẫn giống nhau, chẳng hạn như chữ ngày càng nhạt (sáng hơn), hoặc nền ngày càng đậm (tối hơn).
Khi đó, chữ, nền và viền cần được khai báo ở các cấp độ sáng khác nhau. Nếu coi 100% là mức sáng nhất, thì một hộp có màu nền sáng 96% trên nền trắng vẫn có thể nhận ra, nhưng nếu áp dụng độ sáng 96% cho màu chữ thì sẽ không nhìn thấy được.
Ngoài ra, chữ, nền và viền không được dùng riêng lẻ. Ba yếu tố này được sử dụng kết hợp với nhau. Sau khi khai báo từng màu rồi phối hợp chúng, có thể xảy ra tình trạng chữ không nhìn thấy trên nền, hoặc nền và đường viền không phân biệt được. Việc điều chỉnh những thứ này không hề dễ.
Nếu áp dụng 4 cấp độ sáng cho từng yếu tố chữ, nền và viền, số tổ hợp đã lên tới 64; nếu tính thêm cả dark mode, cần tạo hai bộ gồm 64 tổ hợp.
Vì vậy, tôi đã tạo một công cụ CLI cho phép thiết lập màu và các cấp độ sáng của chữ, nền và viền, đồng thời xem tất cả tổ hợp trong nháy mắt.
Công cụ tạo mã màu CSS dựa trên tệp cấu hình định dạng YAML.
Nó cung cấp chức năng xem trước, cho phép thấy trong nháy mắt mọi cấp độ của chữ, nền và viền ở light/dark mode, cũng như thử các tổ hợp.
Bên cạnh đó, chương trình này được phát triển bằng lập trình cặp (Pair Programming) với AI, sử dụng LLM chạy cục bộ. Tôi chỉ dẫn cách triển khai mã, còn phần việc code thủ công thì giao cho AI.
Môi trường LLM cục bộ như sau.
- CPU: Apple M3 Max 64GB
- Mô hình lập trình chính: Qwen3.6-35B-A3B
- Mô hình lượng tử hóa thực tế sử dụng: Qwen3.6-35B-A3B-oQ4e-fp16-mtp
- Trình chạy LLM chính: oMLX
- Tác nhân lập trình: Pi Coding Agent
Chưa có bình luận nào.