Trang hoàng website với 11 bộ sưu tập hiệu ứng CSS3 đẹp mắt

Trang hoàng website với 11 bộ sưu tập hiệu ứng CSS3 đẹp mắt
     

CSS3 đã mang lại những tính năng tuyệt vời khi thiết kế website, giúp bạn thực hiện nhiều hiệu ứng animation mà không làm giảm tốc độ load trang. Hôm nay,...

CSS3 đã mang lại những tính năng tuyệt vời khi thiết kế website, giúp bạn thực hiện nhiều hiệu ứng animation mà không làm giảm tốc độ load trang. Hôm nay, Tạp Chí Web sẽ chia sẻ với bạn 11 bộ sưu tập hiệu ứng dữ liệu web CSS3 giúp bạn trang hoàng website của mình đẹp hơn bao giờ hết.

1. Hover.css

Hover.css

Hover.css có 5 loại hiệu ứng với 48 kiểu hiệu ứng khác nhau có thể giúp bạn sử dụng tùy ý vào bất cứ mục đích gì. Trong đó nổi bật nhất là có những kiểu hiệu ứng thông dụng và có ích như Speech Bubbles, Shadow and Glow Transitions mà bạn thường thấy trong các giao diện đời mới.


2. Animatable

Animatable
Animatable dành cho các đối tượng block

Animatable là một tập hợp các hiệu ứng chuyển động dành riêng cho các đối tượng block như bóp méo đối tượng, background động, di chuyển đối tượng khá đẹp mắt và mượt mà.


3. Animate.css

Animate.css
Bộ sưu tập có nhiều hiệu ứng nhất

Đây có lẽ là thư viện nhiều hiệu ứng nhất trong bài này với 63 hiệu ứng chuyển động khác nhau mà bạn có thể áp dụng với bất kỳ kiểu đối tượng nào.


4. fancyInput

fancyInput
Hiệu ứng làm đẹp phần gõ chữ trong website

Tập hợp 5 hiệu ứng liên quan đến hiển thị chữ khi gõ vào các thẻ < input type=”text” > và < textarea >. Với hiệu ứng này, nó có thể làm đẹp phần gõ chữ trong website mà đôi khi Javascript muốn làm được điều này phải mất khá nhiều thời gian.


5. Liffect

Liffect
Liffect

Hãy thử tưởng tượng bạn đang có một danh sách các đối tượng và bạn cần nó hiển thị lần lượt nhau với nhiều hiệu ứng khác nhau, và bạn muốn làm việc đó mà không biết làm thế nào? Công cụ tạo hiệu ứng Liffect sẽ giúp bạn ngay thôi.


6. Morf

Morf
Morf

Cũng là một thư viện tập hợp các hiệu ứng chuyển động cho đối tượng block nhưng có lẽ nó tập trung nhiều hơn trong việc hoán đổi vị trí đối tượng.


7. Magic

Magic
Magic

Magic là một bộ thư viện hiệu ứng CSS3 và khi sử dụng kết hợp với jQuery để tạo ra các hiệu ứng chuyển động đẹp mắt. Một điều thú vị là Magic được tạo ra bởi Daniel Eden’s vốn làm việc trên Animate.css.


8. Effeckt.css

Effekt
Effekt

Nếu bạn quá mệt mỏi khi làm các hiệu ứng Modal Box bằng jQuery thì có thể sử dụng Effekt để làm Modal Box hoàn toàn bằng CSS3 với nhiều kiểu cho bạn chọn lựa.


9. Image Hover Effect

Image Hover Effect
Image Hover Effect

Tổng hợp 6 kiểu hiệu ứng cho hình ảnh khi rê chuột vào rất đẹp mắt, bạn có thể sẽ cảm thấy nó quen thuộc biết chừng nào vì không ít giao diện sử dụng các hiệu ứng này.


10. CSS Accordion

CSS Accordion
Tạo accordion đẹp mắt và mượt mà không cần dùng Javascript và jQuery.


11. 16 hiệu ứng đổ bóng bằng CSS3

16 hieu ung do bong bang CSS3
16 hiệu ứng tạo bóng đổ cho các đối tượng mà bạn có thể sử dụng ngay lập tức, chỉ cần copy và paste.


Hy vọng với 11 bộ sưu tập ở trên sẽ giúp website của bạn trở nên đẹp mắt hơn nữa. Nếu tìm kiếm được một bộ sưu tập nào đẹp hơn thì hãy cùng chia sẻ với mọi người nhé.