{"id":17497,"date":"2020-06-25T12:51:16","date_gmt":"2020-06-25T12:51:16","guid":{"rendered":"https:\/\/ampforwp.com\/tutorials\/?post_type=ht_kb&p=17497"},"modified":"2020-06-25T13:00:19","modified_gmt":"2020-06-25T13:00:19","slug":"how-to-set-gutenberg-button-color","status":"publish","type":"ht_kb","link":"https:\/\/ampforwp.com\/tutorials\/article\/how-to-set-gutenberg-button-color\/","title":{"rendered":"How to set Gutenberg button color"},"content":{"rendered":"\n
In this tutorial, we will show you how to set Gutenberg button color for this to follow the below steps<\/p>\n\n\n\n
Step 1 \u2013 <\/strong>Open a post in the block editor or add a new one<\/p>\n\n\n\n
Step 2 \u2013<\/strong>\u00a0Click on the + button and pick the Buttons Block<\/p>\n\n\n\n<\/figure>\n\n\n\n
Step 3 –<\/strong> Create a button within your content and link to another URL <\/p>\n\n\n\n<\/figure>\n\n\n\n
The button colors are updated in the advanced settings panel (found in the right sidebar). You have two options:<\/p>\n\n\n\n
Background color<\/li>
Text color<\/li><\/ul>\n\n\n\n
In these options, you can set the button color<\/p>\n\n\n\n
You’ve now successfully set the button to change the background color like below the screenshot<\/strong><\/p>\n\n\n\n<\/figure>\n\n\n\n
That\u2019s it for this tutorial!<\/strong><\/p>\n\n\n\n
We hope it helped you. If you have any feedback or questions, then please share them in the comments section below.<\/p>\n
\n\t\t\tAsk your Questions Directly!<\/strong> \n\t\t\t
If you can't find the solutions in this article, then just ask us in the comments and we will answer it for you!<\/div>\n\t\t\t
![\"\"](\"https:\/\/ampforwp.com\/tutorials\/wp-content\/uploads\/2020\/06\/1-1.png\")
<\/figure>\n\n\n\n![\"\"](\"https:\/\/ampforwp.com\/tutorials\/wp-content\/uploads\/2020\/06\/4-1024x482.png\")
<\/figure>\n\n\n\n![\"\"](\"https:\/\/ampforwp.com\/tutorials\/wp-content\/uploads\/2020\/06\/5-1024x401.png\")
<\/figure>\n\n\n\n