html – Effects when clicking a button


I would like to know how I can add an effect when clicking a button, I am using HTML5 and CSS.

I add an effect with :HOVER, that as soon as the mouse is positioned over the button its background is changed, however I would like an effect that when clicking on the button the color change effect is activated.



in that case you will have to use JavaScript. Try applying the following code.

        border: 0;
        padding: 35px 50px;
        font-weight: bolder;
        color: #fff;

function mudaCor(el){ = '#'+Math.floor(Math.random()*16777215).toString(16);


<button onclick="mudaCor(this)">Clique</button>

In case the JavaScript function is getting a random color, if you want a standard color, just change the hexadecimal code. See the example below. = '#069';

Scroll to Top