100% trong trình duyệt
Công cụ CSS
Tạo mã CSS gọn gàng, sẵn sàng sao chép và dán một cách trực quan với những công cụ miễn phí này — đổ bóng hộp, gradient, bo góc, flexbox, grid, hoạt ảnh, clip-path và bộ lọc — với bản xem trước trực tiếp khi bạn tinh chỉnh từng giá trị.
⬛
Trình tạo CSS Box Shadow
Thiết kế box-shadow trực quan với xem trước trực tiếp và sao chép CSS.
⬭Trình tạo CSS Border Radius
Điều chỉnh bán kính từng góc với xem trước trực tiếp và sao chép CSS.
▤Trình tạo CSS Gradient
Tạo gradient linear hoặc radial với xem trước trực tiếp và sao chép CSS.
TTrình tạo CSS Text Shadow
Thiết kế text-shadow với xem trước trực tiếp và sao chép CSS.
▲Trình tạo CSS Triangle
Tạo hình tam giác thuần CSS theo mọi hướng và sao chép CSS.
⬓Sân chơi CSS Flexbox
Thử nghiệm các thuộc tính flexbox trên bản xem trước trực tiếp và sao chép CSS được tạo ra.
▦Trình tạo CSS Grid
Tạo bố cục CSS grid với số cột, số hàng và khoảng cách có thể điều chỉnh, kèm bản xem trước trực tiếp.
⤢Trình tạo CSS Transform
Kết hợp translate, rotate, scale và skew thành một CSS transform duy nhất với bản xem trước trực tiếp.
⌒Trình tạo CSS Easing
Chọn hoặc tự dựng một easing cubic-bezier và phát lại trên một chấm xem trước có chuyển động.
▢Trình tạo Glassmorphism
Tạo CSS thẻ kính mờ với độ mờ (blur), độ trong suốt, độ bão hòa và một màu phủ.
◇Trình tạo CSS clip-path
Cắt một phần tử thành các hình dạng phổ biến và sao chép CSS clip-path.
☼Trình tạo CSS Filter
Kết hợp các bộ lọc CSS bằng thanh trượt với xem trước trực tiếp, rồi sao chép.
⤿Trình tạo CSS Animation
Tạo hiệu ứng keyframe, xem trước trực tiếp và sao chép CSS.
◜Trình tạo CSS Spinner
Tạo spinner loading thuần CSS và sao chép CSS.
▩Họa tiết nền CSS
Tạo họa tiết nền CSS với hai màu và sao chép nó.
◳Trình tạo Neumorphism
Tạo bóng đổ neumorphic soft-UI với xem trước trực tiếp và sao chép.
@Trình tạo CSS Media Query
Tạo @media query responsive với các mẫu có sẵn và sao chép nó.
▌Bộ tạo kiểu thanh cuộn CSS
Tạo kiểu thanh cuộn tùy chỉnh và sao chép CSS ::-webkit-scrollbar.
▭Hộp tỉ lệ khung hình CSS
Tạo hộp tỉ lệ khung hình responsive kèm phương án padding dự phòng.
‖Bố cục nhiều cột CSS
Tạo bố cục văn bản nhiều cột CSS kèm đường kẻ phân chia.
T○Viền chữ CSS
Thêm đường viền hoặc nét cho chữ và sao chép CSS.