Teknik Manipulasi Gambar dengan CSS3 | #4 | Mukti911

A. Pendahuluan

Pada kali ini aku akan share bagaimana ca untuk manipulasi dengan dengan CSS. Untuk bisa memanipulasi gambar tidak harus menggunakan software mahal seperti Adobe Photoshop, cukup dengan CSS saja maka Anda sudah bisa memanipulasi gambar kalian menjadi lebih menarik dengan memberikan berbagai efek.

B. Latar Belakang

CSS sekarang memang tidak sama dengan CSS beberapa tahun lalu, CSS kini lebih powerful, CSS memiliki banyak fitur yang jika dipergunakan dengan baik maka bisa untuk memanipulasi foto.

C. Maksud dan Tujuan
Agar dapat memanfaatkan fitur CSS3 yang dapat memanipulasi gambar.

D. Alat & Bahan

• Browser
• Text Editor

E. Waktu Pelaksanaan

• 10 Menit

F. Pembahasan

CSS3 memiliki berbagai fitur yang memungkinkan hal tersebut (memanipulasi foto), diantaranya adalah:

Filter, blend, modes, gradients, box-shadow, stoke, rotation, dan lain sebagainya.

Fitur-fitur tersebut membuat tampilan gambar di browser menjadi lebih menarik, tidak perlu lagi menggunakan aplikasi pengolah foto seperti Photoshop jika ingin sekadar memberi efek overlay, multiply, screen, color-dodge, lighten, hue, saturation, gradients dll.

Efek-efek yang biasa kita temukan di Photoshop kini bisa kita lakukan hanya dengan CSS, dan seketika browser akan menampilkan hasilnya.

Berikut sebuah video dari Una Kravets yang berjudul Editing Images di CSS yang dia paparkan pada seminar dotCSS 2015 lalu.

G. Hasil Yang Didapat

• Dapat memanipulasi gambar.

H. Kesimpulan
Jadi dalam pengembangan CSS3, CSS sudah dapat melakukan manipulasi gambar.

I. Referensi

• www.w3school.com