Chào mọi người.
Mình vừa tìm được công cụ này bên
anhtrainang.com nên mình không chần chừ gì viewsource công cụ này và chia sẽ lại để mọi người biết và làm ảnh bài viết đẹp mắt và tạo bản quyền riêng cho website của mình.Công cụ này cho phép bạn tạo ảnh thumbnail YouTube (1280x720) có hiệu ứng phát sáng động (Glow Motion) hoàn toàn bằng HTML + CSS + SVG animate, không cần framework hay API ngoài.
Điểm đặc biệt là code này chạy được ngay trên nền Blogspot, tức là chỉ cần chèn đoạn code vào Trang blogspot và sử dụng luôn không cần làm gì thêm!
Các tính năng chính
- 🖼 Kích thước chuẩn thumbnail: 1280×720px, 960x540px, 640x360px.
- 💡 Hiệu ứng phát sáng “Glow Motion” mượt chậm, màu cố định theo theme.
- 🔵 10 kiểu họa tiết nền động: Circle Lines, Dot Grid, Wave, Ribbon, Halo, Mesh...
- 🧩 Có thể đổi màu chủ đạo, tiêu đề, mô tả, logo riêng.
- 💾 Xuất ảnh PNG tĩnh (canvas render).
- ⚙️ Hoạt động ổn định ngay trên trang Blogspot.
Cấu trúc công cụ
Toàn bộ công cụ chỉ gồm một khối HTML duy nhất chứa:
-
Phần giao diện form nhập liệu (
Title,Description,Logo,Theme Color,Layout Decor). -
Phần preview động SVG (
Glow Motion). - Phần script xử lý render + xuất PNG.
Cách sử dụng
- Mở trang Blogger → Trang mới → Chế độ HTML.
- Dán toàn bộ đoạn code ở dưới vào bài viết.
- Xuất bản Trang – công cụ sẽ hoạt động trực tiếp.
- Nhập thông tin, chọn layout, bấm Download PNG để xuất ảnh thumbnail.
Demo phía bên dưới hoặc tại đây .
Thumbnail Generator
🖼️ Thumbnail Generator v7.0 — Glow Motion Pro
Preview dynamic, export PNG 1280×720
Tip: Chuột phải vào preview → “Save image as...” để tải nhanh ảnh SVG.
Theo AnhTraiNang.Com
Hướng dẫn bình luận
Mọi người để lại bình luận góp ý, nhận xét về những bài viết mà mình chia sẽ văn minh lịch sự hay kích động, Không spam, không chèn link quảng cáo, bán hàng, Không sử dụng từ ngữ thô tục, xúc phạm, kích động, Link chỉ được phép khi thực sự liên quan đến nội dung bài viết, Không mạo danh người khác hoặc sử dụng email giả, Bình luận vi phạm sẽ bị xóa không cần thông báo trước.Mọi người lưu ý răng, nếu muốn chia sẽ code ở bình luần thì cần mã hóa code trước khi bỏ vào khung nhé. :)
⑴ Chèn ℂ𝕤𝕤 theo mẫu :
[pre css] CSS [/pre]⑵ Chèn ℍ𝕥𝕞𝕝 theo mẫu :
[pre html] HTML [/pre]⑶ Chèn 𝕁𝕒𝕧𝕒𝕤𝕔𝕣𝕚𝕡𝕥 theo mẫu :
[pre js] Javascript [/pre]🖼️ Chèn 𝕀𝕞𝕒𝕘𝕖 theo mẫu :
[img] Link hình ảnh [/img]🎞️ Chèn Video 𝕐𝕠𝕦𝕥𝕦𝕓𝕖 theo mẫu :
[youtube] Link Youtube [/youtube]0 Nhận xét