Thiết kế & CSS
Tạo CSS trực quan: đổ bóng, gradient, bố cục flexbox và grid, hiệu ứng chuyển động và bảng màu
Tạo CSS trực quan rồi sao chép mã: đổ bóng khối và chữ, gradient và mesh gradient, bố cục flexbox và grid, bo góc, clip-path, bộ lọc, biến đổi (transform), hiệu ứng chuyển động, cùng hiệu ứng glassmorphism hoặc neumorphism. Công cụ tạo bảng màu và sắc độ giúp bạn xây dựng hệ màu nhất quán, còn công cụ tạo sóng, blob và họa tiết SVG giúp tạo nền nhẹ.
Số công cụ trong danh mục: 18
Nên bắt đầu từ đây
Tất cả công cụ trong danh mục
-
Tạo CSS Animation
Tạo animation CSS @keyframes từ mẫu có sẵn hoặc keyframe của bạn, đặt thời lượng, độ trễ, số lần lặp, hướng chạy, chế độ fill và đường cong cubic-bezier.
-
Tạo Border Radius
Tạo CSS border-radius với từng góc độc lập, bán kính elip X/Y, đơn vị px hoặc % và các mẫu hình blob. Xuất dạng viết tắt hợp lệ ngắn nhất.
-
Tạo Clip Path
Tạo hình CSS clip-path: đa giác với điểm kéo thả và mẫu có sẵn, hình tròn, elip và inset có bo góc. Xem trước trực tiếp và sao chép mã.
-
Tạo bảng màu
Tạo bảng màu từ một màu gốc theo phối màu bổ túc, tương đồng, bộ ba, bộ bốn, hình vuông hoặc đơn sắc. Khóa màu và xuất CSS/Tailwind.
-
Tạo sắc độ màu
Biến một màu thành thang 50–950 kiểu Tailwind cùng tint, shade và tone. Tính trong OKLCH và sRGB, xuất dạng biến CSS, Tailwind hoặc JSON.
-
Tạo CSS Box Shadow
Tạo CSS box-shadow trực quan: xếp nhiều lớp bóng, chỉnh độ lệch, độ mờ, độ lan, inset và độ trong suốt RGBA, xem trước trực tiếp và sao chép mã gọn gàng.
-
Tạo CSS Flexbox
Đặt trực quan flex-direction, wrap, justify-content, align-items, gap và flex, order, align-self cho từng item, với phần tử con hiển thị trực tiếp và mã CSS sao chép được.
-
Tạo CSS Gradient
Thiết kế gradient CSS tuyến tính, tỏa tròn và hình nón với điểm dừng màu kéo thả được, góc, chế độ lặp và nội suy OKLCH. Xem trước trực tiếp, sao chép mã.
-
Tạo CSS Grid
Dựng bố cục CSS Grid trực quan: grid-template-columns/rows, vùng đặt tên có kiểm tra, gap, căn chỉnh và vị trí từng phần tử. Sao chép mã CSS gọn gàng.
-
Tạo CSS Filter
Kết hợp các hàm CSS filter (blur, brightness, contrast, grayscale, hue-rotate, invert, opacity, saturate, sepia, drop-shadow) trên ảnh mẫu hoặc ảnh của bạn.
-
Tạo Glassmorphism
Tạo CSS kính mờ với backdrop-filter làm mờ và tăng bão hòa, màu phủ và độ đậm, viền và bóng đổ, kèm tiền tố -webkit- cho Safari.
-
Tạo Mesh Gradient
Tạo nền CSS kiểu mesh mềm mại từ nhiều lớp radial gradient. Kéo các điểm màu, chỉnh độ lan, tạo ngẫu nhiên theo seed và sao chép mã CSS thuần.
-
Tạo Neumorphism
Tạo CSS soft UI (neumorphism): bóng sáng và tối suy ra từ màu gốc, các kiểu phẳng, lõm, lồi hoặc nhấn xuống và bốn hướng nguồn sáng.
-
Tạo họa tiết CSS
Tạo họa tiết nền thuần CSS – chấm, chấm bi, sọc, bàn cờ, lưới, zíc zắc và lưới chữ thập – với màu sắc, kích thước ô và độ dày tùy chỉnh. Không cần ảnh.
-
Tạo hình blob SVG
Tạo hình blob SVG hữu cơ mượt mà với số điểm, độ ngẫu nhiên và seed tùy chỉnh. Tô màu đặc, gradient hoặc chỉ viền, tải .svg hoặc sao chép data URI cho CSS.
-
Tạo sóng SVG
Tạo sóng SVG mượt, nhọn hoặc bậc thang với nhiều lớp, biên độ và seed. Tải file .svg hoặc sao chép dạng data URI nền CSS để làm vách ngăn giữa các phần.
-
Tạo Text Shadow
Tạo hiệu ứng CSS text-shadow nhiều lớp: chữ phát sáng, viền chữ, 3D kiểu retro và chữ chạm nổi. Xem trước trực tiếp với chữ của bạn và sao chép mã.
-
Tạo CSS Transform
Tạo giá trị CSS transform: translate, rotate, scale, skew cùng perspective 3D, rotateX/rotateY và translateZ, với transform-origin và xem trước trực tiếp.
Danh mục khác
- CRC Thuật toán kiểm tra dư thừa vòng để phát hiện lỗi
- MD Thuật toán tóm tắt thông điệp (MD2, MD4, MD5)
- SHA-1 Thuật toán băm an toàn 1 - hàm băm 160-bit
- SHA-2 Họ thuật toán băm an toàn 2 (SHA-224, SHA-256, SHA-384, SHA-512)
- SHA-3 Thuật toán băm an toàn 3 dựa trên Keccak
- Keccak Hàm băm mật mã Keccak
- SHAKE Hàm đầu ra có thể mở rộng (SHAKE128, SHAKE256)
- cSHAKE Hàm SHAKE có thể tùy chỉnh
- KMAC Mã xác thực thông điệp Keccak
- Mật khẩu & Bảo mật Công cụ tạo, phân tích, băm và bảo mật mật khẩu
- Mã hóa & Mật mã Mã hóa đối xứng và bất đối xứng, HMAC và tạo khóa (AES, 3DES, RSA, PGP)
- Encode & Decode Encode và decode dữ liệu: Base64, Base32, Base58, URL, thực thể HTML, hex, Unicode và nhiều định dạng khác
- Công cụ định dạng Định dạng, nén và kiểm tra mã nguồn, dữ liệu (JSON, XML, YAML, SQL, HTML, CSS) và đổi kiểu đặt tên
- Công cụ tạo dữ liệu Tạo ID, khóa, dữ liệu thử nghiệm, mã QR, mã vạch và file cấu hình (UUID, API key, .gitignore, Dockerfile)
- Công cụ chuyển đổi Chuyển đổi định dạng dữ liệu, hệ cơ số, màu sắc, timestamp, đơn vị và tiền tệ (JSON, CSV, YAML, XML)
- Công cụ văn bản Đếm, so sánh, làm sạch và biến đổi văn bản (đếm từ, so sánh, regex, chữ hoa/thường, dòng trùng)
- Công cụ hình ảnh Công cụ để thao tác và chuyển đổi hình ảnh (Nén, Thay đổi kích thước, Chuyển đổi)
- Công cụ Web Công cụ cho lập trình web và SEO (JWT, URL, DNS, HTTP header, thẻ meta, sitemap)
- Toán học & Công cụ tính Công cụ tính cho tài chính, sức khỏe, phần trăm, phép tính lập trình và toán học hằng ngày
- Thời gian & Ngày tháng Múi giờ, khoảng cách ngày, ngày làm việc, hẹn giờ, đồng hồ bấm giờ và đồng hồ thế giới