https://github.com/brunos3d/video-ambilight

🌈 HTML5 + JS - Ambilight Effect sample project (YouTube iframe, Video + Canvas).
https://github.com/brunos3d/video-ambilight

ambilight clone css design effect event html5 javascript nextjs nextjs-conf sample styles

Last synced: 9 days ago
JSON representation

🌈 HTML5 + JS - Ambilight Effect sample project (YouTube iframe, Video + Canvas).

• Host: GitHub
• URL: https://github.com/brunos3d/video-ambilight
• Owner: brunos3d
• License: mit
• Created: 2021-08-10T06:49:14.000Z (over 3 years ago)
• Default Branch: main
• Last Pushed: 2021-08-25T00:27:34.000Z (about 3 years ago)
• Last Synced: 2023-03-03T10:33:46.313Z (over 1 year ago)
• Topics: ambilight, clone, css, design, effect, event, html5, javascript, nextjs, nextjs-conf, sample, styles
• Language: TypeScript
• Homepage: https://brunos3d.github.io/video-ambilight/
• Size: 867 KB
• Stars: 21
• Watchers: 3
• Forks: 1
• Open Issues: 1
• Metadata Files:
  • Readme: README.md
  • License: LICENSE

Awesome Lists containing this project

README

        


  

    

  





  Video Ambilight





  🌈 💻 ✨





  HTML5 + JS - Ambilight Effect sample project (YouTube iframe, Video + Canvas).



## 🧪 About

This is a project that came about as an inspiration after the release of Next.js 11 during Nextjs Conf, where the video player on the presentation page had an ambilight effect.

## 🚀 [Preview](https://brunos3d.github.io/video-ambilight/)

[Video + Canvas](https://brunos3d.github.io/video-ambilight/canvas/index.html)

[YouTube iframe](https://brunos3d.github.io/video-ambilight/youtube/index.html)

## 🖋 CodePen

[Video + Canvas](https://codepen.io/brunos3d/pen/ExWMaYx)

[YouTube iframe](https://codepen.io/brunos3d/pen/WNjLEGR)