[Resolved] how to turn round buttons into square buttons

Hi Vladimir,

Here is a CSS code you may try adding in Appearance > Customize > Additional CSS:

.wp-block-button__link {
    border-radius: 0;
}

You may also make this more specific by setting a custom class to the WordPress Button Block, for instance, make-square. Then, use this CSS instead:

.make-square .wp-block-button__link {
    border-radius: 0;
}

Hope this helps! Kindly let us know how it goes. 🙂

To add a hover effect similar to the buttons above, you can try this CSS:

a.wp-block-button__link:hover{
    background-color:var(--contrast-2);
}

Moreover, you’ll also need to add this CSS as there seems to be too much margin from this core WordPress Block:

.site-content .entry-content .wp-block-buttons {
    margin: unset;
}

Hope this helps! 🙂

You’re welcome Vladimir! 🙂