Tidak ada satu cara untuk menyelesaikan tantangan antarmuka. Dalam seri ini, kami akan menantang diri kami sendiri dan satu sama lain untuk menemukan berbagai cara menyelesaikan tantangan antarmuka dan memperluas keberagaman keterampilan kita.
Dalam GUI Challenge hari ini, @AdamArgyleInk membuat palet warna gamut lebar dengan okLCH, memeriksa pasangan warna yang dapat diakses di sepanjang jalan, ins...
Dalam GUI Challenge hari ini, @AdamArgyleInk memberikan sentuhan #CSS pada efek teks 3D film sci-fi klasik dengan membuatnya interaktif untuk di-scroll. D...
Dalam GUI Challenge hari ini, @AdamArgyleInk mengubah grup radio menjadi grup tombol yang mengubah perataan teks. Pelajari cara menguji aksesibi...
Dalam GUI Challenge hari ini, @AdamArgyleInk menciptakan efek cyber glitch dengan clip-path dan transformasi CSS.
Dalam Tantangan GUI hari ini, @AdamArgyleInk senang membuat efek UI fisika dengan properti kustom CSS, meminta frame animasi, dan ...
Dalam GUI Challenge hari ini, @AdamArgyleInk membuat animasi stack kartu menggunakan transform origin, grid, dan :has().
Dalam Tantangan GUI yang berhantu hari ini, @AdamArgyleInk membuat kode langsung transisi jalur klip CSS, demo beberapa efek rad, dan mencakup kesalahan. M
Dalam Tantangan GUI hari ini, @AdamArgyleInk membuat tooltip dengan elemen kustom (tanpa komponen web!), :has(), transformasi, dan proposisi logis...
Dalam Tantangan GUI hari ini, @AdamArgyleInk menciptakan kembali ilusi klasik dengan CSS.
Dalam GUI Challenge hari ini, @AdamArgyleInk membagikan fitur dan aspek komponen carousel: tema adaptif, adaptif untuk berbagai aplikasi...
Dalam GUI Challenge hari ini, @AdamArgyleInk membuat beberapa tombol tindakan mengambang (FAB) dan membahas pertimbangan UX dan CSS ...
Dalam Tantangan GUI hari ini, @AdamArgyleInk menata gaya semua jenis tombol web yang berbeda dengan properti khusus dan :where(), untuk terang/gelap...
Dalam GUI Challenge hari ini, @AdamArgyleInk menunjukkan cara memperindah elemen dialog secara visual sambil mempertahankan kemudahan akses dan interaksi...
Dalam GUI Challenge hari ini, @AdamArgyleInk menunjukkan cara menata gaya elemen progres bawaan dan cara mengimplementasikan UX pembaca layar yang...
Dalam GUI Challenge hari ini, @AdamArgyleInk berbagi pemikiran tentang cara membuat favicon adaptif dengan SVG. SVG tidak hanya memberikan sesuatu yang tak terbatas...
Dalam GUI Challenge hari ini, @AdamArgyleInk berbagi pemikiran tentang cara membuat komponen tombol tema. Sering kali situs akan memungkinkan peralihan...
Dalam GUI Challenge hari ini, @AdamArgyleInk berbagi pemikiran tentang cara membuat toast, komponen non-interaktif dan pasif bagi UI untuk menyediakan...
Dalam tantangan GUI hari ini, @AdamArgyleInk membagikan pemikirannya tentang cara membuat menu video game 3D yang beradaptasi dengan preferensi warna OS, ...
Dalam tantangan GUI hari ini, saya berbagi pemikiran saya tentang cara yang memungkinkan pengguna untuk melakukan multi-pilihan. Untuk mendemonstrasikan multi-pilihan, saya telah menyiapkan filter...
Dalam tantangan GUI hari ini, saya berbagi pemikiran saya tentang cara memecahkan tombol terpisah. Komponen pokok untuk antarmuka yang ringkas, memungkinkan si...
Dalam tantangan GUI hari ini, saya berbagi pemikiran saya tentang cara menyelesaikan sebuah {i>switch
Dalam tantangan GUI hari ini, kami membangun komponen breadcrumb.. dengan sentuhan khusus! Sebagai pengganti daftar link linear, breadcrumb ini...
Dalam tantangan GUI saat ini, kita membuat skema warna gelap, terang, dan redup dengan HSL. CSS berfungsi di seluruh browser modern, menetapkan untuk...
Dalam tantangan GUI hari ini, @Adam Argyle berbagi pemikiran tentang cara menciptakan pengalaman scroll inline untuk web yang minimal, respons...

Memikirkan cara untuk memecahkan SPLIT TEXT

Dalam tantangan GUI hari ini, @AdamArgyleInk akan menanggapi komentar Anda selama 30 menit pertama setelah episode dirilis. Sambungkan...
Dalam tantangan GUI hari ini, kita membuat dan mendemonstrasikan halaman setelan dinamis dengan penggeser dan kotak centang. Halaman setelan kami responsif, mendukung...
Dalam tantangan GUI hari ini, kami sedang membuat komponen tab dengan beberapa fitur yang sangat keren yang mungkin tidak terlintas di pikiran Anda. Tab kami mencakup...
Kami meminta komunitas untuk membuat komponen sidenav dengan cara Anda dan Anda semua berhasil melakukannya! Lihat kiriman:
Dalam tantangan GUI hari ini, kami membuat pengalaman pengguna navigasi samping yang responsif dan mudah diakses menggunakan CSS dan JS. Sidenav berfungsi...
Kami telah menguji 5 teknik pemusatan CSS yang berbeda dan menantang Anda untuk mengirimkan teknik Anda sendiri. Selamat kepada Chris Coyier dari CSS-Tricks ...
Anda melihat saya membuat cerita dengan cara saya dan saya menantang Anda semua untuk membuatnya sesuai keinginan. Selamat kepada @Geoffrich_ atas kirimannya di Twitter. Silakan...
Dalam tantangan hari ini, kita sedang menguji 5 teknik pemusatan CSS yang berbeda. Lihat teknik apa yang seharusnya mendapatkan tempat di alat Anda bel...
Selamat datang di Tantangan GUI, di mana saya membuat antarmuka dengan cara saya dan menantang Anda untuk melakukannya sesuai keinginan Anda. Dengan gabungan pikiran kreatif, kita akan...