This one is a Nice CSS animation. It splits when hovered.
You can change the text, colors, with the CSS code.
Hover over the word Impossible
For the transformation of the title, You just have to add an embed element for the HTML text itself
<h1><span>I</span>M<span>POSSIBLE</span></h1>
And then add this CSS (you can tweak it with your own colors) in the embeded element custom CSS
h1 {
color: hsl(0, 0%, 28%);
font-size: 50px;
font-weight: bold;
font-family: monospace;
letter-spacing: 7px;
cursor: pointer;
}
h1 span {
transition: 0.5s ease-out;
}
h1:hover span:nth-child(1) {
margin-right: 5px;
}
h1:hover span:nth-child(1):after {
content: "'";
}
h1:hover span:nth-child(2) {
margin-left: 30px;
}
h1:hover span {
color: #fff;
text-shadow: 0 0 10px #fff, 0 0 20px #fff, 0 0 40px #fff;
}
If you just want a simple glow effect, add a text element and change the tag to your need. The one in this code is H3, you can see the effect on the subtitles of this page.
Then add the CSS to the custom CSS of the text element
h3 span {
transition: 0.5s ease-out;
}
h3:hover span {
color: #ffeeef;
text-shadow: 0 0 10px #fff, 0 0 20px #fff, 0 0 40px #fff;
}
Animated Title
Any ideas or Requests
Thanks
Feel free to contact us.
if you have any Hacks that would be great to add or any ideas you would like to be solved with Brizy cloud, You can write at contact@monsieurclick.com or use the form to upload images and ideas. Thanks a lot !!!
If you want just to say thank you or help us maintain this page, Feel free to donate whatever you want