SVG Noise & Texture Generator Create organic grainy noise and turbulent cloud textures directly in your browser using the SVG feTurbulence filter. Drag the sliders, tweak the seed, pick a tint color, and watch the texture update live. Export as inline SVG, a CSS background-image data URI, or a reusable SVG filter you can apply ...
Coba Alat »ANSI Terminal Color Code Generator Build ANSI escape sequences (Select Graphic Rendition codes) for coloring and styling terminal output. Pick a foreground and background color, toggle styles like bold or underline, and get a ready-to-paste escape string plus a live preview of how it renders in a terminal. How to Use Type the sample text ...
Coba Alat »Color Swatch Sheet Generator Paste a list of colors and instantly preview them as a printable swatch sheet with hex labels. Mix any CSS color format you like — short and long hex, rgb(), rgba(), hsl(), hsla(), or named colors such as tomato — then download the sheet as a high resolution PNG or scalable ...
Coba Alat »Unified Color Space Converter Paste a color in any common format and instantly see it represented across nine color spaces side by side. The converter auto-detects HEX, RGB, HSL, HSV/HSB, CMYK, CIE LAB, LCH, CIE XYZ, Oklab, and CSS named colors, then computes every other representation using full sRGB gamma correction and the standard D65 ...
Coba Alat »Textile & Yarn Converter Cross-reference knitting needle sizes, crochet hook sizes, and yarn weight categories across US, UK/Canada, metric, and Japanese standards in one place. Useful when a pattern from one country lists a needle or yarn name that does not match what is printed on your local supplies. How to Use Pick a category ...
Coba Alat »Generator Tekstur Gradien CSS Buat efek teks yang menarik dengan gradien berwarna ganda dan hasilkan kode CSS siap digunakan dalam satu klik. Pilih warna, pilih linear atau radial, lihat pratinjau langsung, lalu salin snippet ke dalam stylesheet Anda. Cara Penggunaan Masukkan teks sampel yang ingin dipreview. Tetapkan ukuran dan bobot font...
Coba Alat »Generator Gambar Kartu Sosial Open Graph Buat gambar bagikan sosial yang presisi pixel demi pixel untuk Open Graph, Twitter Cards, LinkedIn, dan Facebook langsung di browser Anda. Masukkan judul, deskripsi, dan nama situs, pilih tata letak dan tema, lalu unduh dalam format PNG, JPG, atau WebP dengan dimensi tepat yang diharapkan setiap platform — tanpa perlu alat desain atau unggah...
Coba Alat »Generator CSS Neumorf Buat elemen antarmuka yang lembut dan terdorong tanpa harus menyesuaikan dua bayangan kotak secara manual. Pilih warna dasar, pilih bentuk (datar, cekung ke dalam, cekung ke luar, atau ditekan), geser slider untuk jarak, intensitas, blur, dan sudut cahaya, lalu salin kode CSS yang dihasilkan langsung ke proyek Anda. Cara Penggunaan Pilih warna latar belakang. Warna yang sama...
Coba Alat »Generator Warna Tint & Shade Pilih warna hex atau RGB dan segera dapatkan 10 tint (warna Anda dicampur dengan putih) dan 10 shade (dicampur dengan hitam) sebagai sampel visual. Klik salah satu sampel untuk menyalin kode hex-nya, atau ekspor seluruh set sebagai properti CSS, variabel SCSS, JSON, atau daftar hex sederhana...
Coba Alat »Generator Skala Warna Tailwind CSS Tempel satu warna hex dan segera dapatkan skala penuh berdasarkan Tailwind dengan langkah yang merata secara persepsi. Skala ini dibangun dalam ruang warna OKLCH, sehingga setiap tahap terasa seperti peningkatan kecerahan yang merata bagi mata manusia — bukan hanya penurunan linear pada RGB atau HSL. ...
Coba Alat »Kanvas Seni Pixel & Ekspor CSS Impor sprite ber gaya 8-bit yang tajam secara langsung di browser Anda dan ekspor sebagai seni CSS box-shadow, SVG yang dapat diperbesar, PNG raster, atau JSON portabel. Kanvas ini dapat diatur dari ukuran 8×8 hingga 64×64, dilengkapi dengan palet klasik (NES, Game Boy, PICO-8, CGA, Commodore 64, Sweetie 16), serta memberikan fitur menggambar, penghapus, ...
Coba Alat »Pengvisualisasi & Editor Path SVG Tempel atribut path apa saja dari SVG dan lihat hasilnya secara langsung. Alat ini memecah setiap perintah menjadi parameter dan titik akhir absolut, menggambar tangan kontrol Bezier di atas tampilan pratinjau, dan menulis ulang path antara koordinat absolut dan relatif dengan presisi yang dapat dikonfigurasi. Alat ini dibangun khusus untuk penulis SVG ...
Coba Alat »Generator CSS Flexbox (Visual) Desain tata letak Flexbox secara visual dan salin CSS siap digunakan. Sesuaikan arah, penyesuaian, penggabungan, jarak, dan peraturan per-item sambil pratinjau langsung diperbarui secara instan. Tidak perlu menebak, tidak perlu pergi ke Chrome DevTools — cukup pilih perilaku container yang dibutuhkan, lihat hasilnya, dan ambil aturan yang dihasilkan. Cara Penggunaan Pilih arah flex (baris, ...
Coba Alat »Penghasil Logo README Generator Penghasil Logo README Generator membuat badge berukuran piksel-ke-piksel seperti Shields.io secara langsung di browser Anda. Pilih preset atau buat label dan pesan Anda sendiri, pilih warna dan gaya (flat, flat-square, for-the-badge, atau plastic), serta dapatkan output Markdown, HTML, SVG, dan URL data yang siap digunakan. Tidak ada panggilan API eksternal, tidak ada ketergantungan jaringan, tidak ada badge yang rusak...
Coba Alat »Generator Animasi Keyframe CSS Buat animasi @keyframes CSS secara visual dengan pratinjau langsung. Pilih dari 10 preset populer seperti bounce, shake, pulse, fade in, slide in, spin, swing, rubber band, flash, dan wobble — atau buat animasi keyframe kustom dari awal. Sesuaikan waktu, easing, jumlah iterasi, arah, dan mode pengisian, lalu salin ...
Coba Alat »Kalkulator Khususitas CSS Kalkulator Khususitas CSS membantu Anda menentukan skor khususitas tepat dari setiap pilihan CSS. Memahami khususitas sangat penting untuk memperbaiki konflik CSS dan menulis stylesheet yang dapat dipelihara. Masukkan satu atau lebih pilihan CSS dan segera lihat skor (a,b,c) mereka dibandingkan secara bersamaan. Cara Penggunaan Masukkan satu pilihan CSS per baris di ...
Coba Alat »Generator Filter CSS Generator Filter CSS memungkinkan Anda membuat efek filter CSS secara visual dengan pratinjau gambar langsung. Sesuaikan properti filter individual menggunakan penggeser intuitif dan lihat hasilnya secara instan — tanpa tebak-tebak. Setelah Anda puas dengan tampilannya, salin kode CSS yang dihasilkan dan tempelkan langsung ke stylesheet Anda. Cara Penggunaan ...
Coba Alat »Simulator & Pencatat Buta Warna Lihat bagaimana gambar dan palet warna Anda terlihat oleh orang-orang dengan defisiensi penglihatan warna. Simulasikan 8 jenis CVD dan uji desain Anda untuk kepatuhan kontras WCAG untuk memastikan aksesibilitas bagi semua pengguna. Cara Menggunakan Unggah gambar atau masukkan nilai warna untuk disimulasikan. Pilih defisiensi penglihatan warna ...
Coba Alat »Generator CSS Clip-Path Buat bentuk clip-path CSS secara visual dengan editor drag-and-drop yang intuitif. Buat poligon, lingkaran, elips, dan bentuk inset, lalu salin CSS yang dihasilkan langsung ke stylesheet Anda. Cara Menggunakan Pilih jenis bentuk atau mulai dari templat preset. Seret titik kontrol untuk menyesuaikan bentuk secara visual pada kanvas pratinjau. ...
Coba Alat »Ekstraktor Palet Warna Unggah gambar apa pun dan segera ekstrak palet warna dominannya. Menggunakan kuantisasi median cut untuk mengidentifikasi warna yang paling menonjol, memberi Anda nilai HEX, RGB, dan HSL yang akurat dengan persentase penggunaan. Cara Menggunakan Unggah gambar dengan menyeret dan melepaskan atau mengklik area unggah. Alat ini secara otomatis menganalisis gambar ...
Coba Alat »Tambahkan alat IO ke browser favorit Anda untuk akses instan dan pencarian lebih cepat
Papan Skor adalah cara yang menyenangkan untuk melacak permainan Anda, semua data disimpan di browser Anda. Lebih banyak fitur akan segera hadir!
Memperbarui: Kita alat terbaru was added on Jun 1, 2026
Bantu kami untuk terus menyediakan alat gratis yang berharga
