Announcement

Collapse
No announcement yet.

CSS for Button Glow Effect on Hover

Collapse
X
 
  • Filter
  • Time
  • Show
Clear All
new posts

  • yilmaz
    replied
    emi 👋
    It works just like you labeled it.
    Nessa Nessa emi emi like this.

    Leave a comment:


  • emi
    replied
    Awesome! thanks yilmaz

    Made this notes to remember what does what,.. i always forget, and i will like to change colors for my others templates in the future.
    I tested it quick, but tell me if i am mistaken

    Code:
    /* all button hover glow s */
    .b-button:hover {
    background: #03e9f4; /*button color*/
    color: #fff; /*button text color*/
    border-radius: 5px; /*border size*/
    box-shadow: 0 0 5px #03e9f4, 0 0 25px #03e9f4, 0 0 50px #03e9f4, 0 0 100px #03e9f4; /*glow color*/
    }
    /* all button hover glow e */
    Nessa Nessa yilmaz yilmaz like this.

    Leave a comment:


  • Nessa
    replied
    I just added the code and looks amazing!!!!

    thank you! thank you!!


    yilmaz yilmaz likes this.

    Leave a comment:


  • yilmaz
    started a topic vB5.X.X CSS for Button Glow Effect on Hover

    CSS for Button Glow Effect on Hover

    There is a new trend in web design these days and that is to have a glowing button effect for call to action (CTA) buttons in an other-wise clean and flat design. In this post, I will create a simple button and apply glow effect with CSS on it when user hovers over it. We can also use the CSS presented below to add a permanent glow effect to CSS buttons.

    Add the following code in the theme css_additional.css template you are using.

    HTML Code:
    /* all button hover glow s */
    .b-button:hover {
    background: #03e9f4;
    color: #fff;
    border-radius: 5px;
    box-shadow: 0 0 5px #03e9f4, 0 0 25px #03e9f4, 0 0 50px #03e9f4, 0 0 100px #03e9f4;
    }
    /* all button hover glow e */
    Demo: all buttons on this site


    How can I do?

X

Thread Information

Collapse

Users Browsing this Thread

There are currently 2 users browsing this thread. (0 members and 2 guests)

    Those who read this thread

    Collapse

    Working...
    X

    AdBlock Detected

    Please Disable Adblock

    Please consider supporting us by disabling the ad blocker.

    I've Disabled AdBlock