WebGL text effect using OGL https://github.com/oframe/ogl
Background picture by Vinicius Amano https://unsplash.com/photos/f9oQZOk9vnk
A Pen by Robin Delaporte on CodePen.
| ## Follow this link for further updates to Github Desktop for Ubuntu https://github.com/shiftkey/desktop/releases/latest | |
| # UPDATE (2021-10-18): Thanks to Amin Yahyaabadi's message, the updated code is as follows | |
| sudo wget https://github.com/shiftkey/desktop/releases/download/release-2.9.3-linux3/GitHubDesktop-linux-2.9.3-linux3.deb | |
| ### Uncomment below line if you have not installed gdebi-core before | |
| # sudo apt-get install gdebi-core | |
| sudo gdebi GitHubDesktop-linux-2.9.3-linux3.deb | |
| # UPDATE (2021-03-05): Thanks to PaoloRanzi81's comment, the updated code is as follows https://gist.github.com/PaoloRanzi81 |
WebGL text effect using OGL https://github.com/oframe/ogl
Background picture by Vinicius Amano https://unsplash.com/photos/f9oQZOk9vnk
A Pen by Robin Delaporte on CodePen.
| /* -------------------------------------------------------------------------- */ | |
| // All Bootstrap 5 Sass Mixins [ Cheat sheet ] | |
| // Updated to Bootstrap v5.1.x | |
| // @author https://anschaef.de | |
| // @see https://github.com/twbs/bootstrap/tree/main/scss/mixins | |
| // @see https://github.com/twbs/bootstrap/blob/main/scss/_variables.scss | |
| /* -------------------------------------------------------------------------- */ | |
| // Options | |
| // @see https://getbootstrap.com/docs/5.1/customize/options/ |
| .css-selector { | |
| background: linear-gradient(346deg, #aaa9ad, #ff9966, #fbfbfd); | |
| background-size: 600% 600%; | |
| -webkit-animation: gradient-accent 1s ease infinite; | |
| -moz-animation: gradient-accent 1s ease infinite; | |
| -o-animation: gradient-accent 1s ease infinite; | |
| animation: gradient-accent 1s ease infinite; | |
| } | |
| @-webkit-keyframes gradient-accent { | |
| 0%{background-position:14% 0%} |
| .css-selector { | |
| background: linear-gradient(21deg, #ffff00, #0000ff, #00ffff, #ff00ea); | |
| background-size: 800% 800%; | |
| -webkit-animation: masthead-background 40s ease infinite; | |
| -moz-animation: masthead-background 40s ease infinite; | |
| -o-animation: masthead-background 40s ease infinite; | |
| animation: masthead-background 40s ease infinite; | |
| } | |
| @-webkit-keyframes masthead-background { | |
| 0%{background-position:0% 0%} |