# CTA custom hover color? **URL:** \ **Category:** CMS Development\ **Created:** [November 12, 2018, 4:28pm UTC](https://community.hubspot.com/t/cta-custom-hover-color/10896 "2018-11-12T16:28:51Z")\ **Posts on this page:** 6\ **Page:** 1
**Author:** ![whitecolin](https://d10pqhm3lwygmk.cloudfront.net/user_avatar/community.hubspot.com/whitecolin/32/69256_2.png) [@whitecolin](https://community.hubspot.com/u/whitecolin)\ **Post date:** [November 12, 2018, 4:28pm UTC](https://community.hubspot.com/t/cta-custom-hover-color/10896/1 "2018-11-12T16:28:51Z")
Hi, I’m trying to customize the look of a CTA button. It’s a rectangular button, we’ve figured out how use custom CSS for a few things but I am unable to figure out how to get the hover-over background color to change from the default, which seems to be a slightly lighter color than than main background color. For example, if my main button color is #AE132A, and I want the hover color to be #aa060f, what would be the custom CSS to do that? I’ve tried a few variations of :hover code but nothing seems to work. Thx! Colin ---
**Author:** ![Stephanie-OG](https://d10pqhm3lwygmk.cloudfront.net/user_avatar/community.hubspot.com/stephanie-og/32/73267_2.png) [@Stephanie-OG](https://community.hubspot.com/u/Stephanie-OG)\ **Post date:** [November 13, 2018, 6:55pm UTC](https://community.hubspot.com/t/cta-custom-hover-color/10896/2 "2018-11-13T18:55:15Z")
Within the “Custom CSS” of the CTA itself you can’t add hover effects but, if you give your CTA a class (e.g. “myCTA”), in your stylesheet you can add something like the following: ```auto .myCTA:hover { background-color: #aa060f; } ``` I hope that helps! * * * [![|300](https://d2qpr2jzcazej7.cloudfront.net/original/2X/e/e6ddb445b684524bbcbd802044a9ca3919d1fbc7.png)](http://www.stephanieogaygarcia.com?utm_source=HubSpotCommunity)HubSpot Design / Development [Website](http://www.stephanieogaygarcia.com?utm_source=HubSpotCommunity) | [Contact](http://www.stephanieogaygarcia.com/contact?utm_source=HubSpotCommunity) _If this helped, please mark it as the solution to your question, thanks!_ ---
**Author:** ![whitecolin](https://d10pqhm3lwygmk.cloudfront.net/user_avatar/community.hubspot.com/whitecolin/32/69256_2.png) [@whitecolin](https://community.hubspot.com/u/whitecolin)\ **Post date:** [November 13, 2018, 7:07pm UTC](https://community.hubspot.com/t/cta-custom-hover-color/10896/3 "2018-11-13T19:07:40Z")
Thank you both, I guess we will go the stylesheet route. Would be great if there were some documentation on what CTA Custom CSS function can handle, and what it can’t. Thx! ---
**Author:** ![ARaycove](https://avatars.discourse-cdn.com/v4/letter/a/ed8c4c/32.png) [@ARaycove](https://community.hubspot.com/u/ARaycove)\ **Post date:** [August 2, 2022, 6:33pm UTC](https://community.hubspot.com/t/cta-custom-hover-color/10896/4 "2022-08-02T18:33:48Z")
Yep if they don’t want to add the feature into the settings they should atleast provide us some sort of documentation. ---
**Author:** ![AShaw4](https://d10pqhm3lwygmk.cloudfront.net/user_avatar/community.hubspot.com/ashaw4/32/192981_2.png) [@AShaw4](https://community.hubspot.com/u/AShaw4)\ **Post date:** [January 21, 2022, 5:55am UTC](https://community.hubspot.com/t/cta-custom-hover-color/10896/5 "2022-01-21T05:55:38Z")
Hi, I find your solution does not work since the CTAs have system styles applied to a ID which also have !important added so the class styles will never override the system ID sytems ---
**Author:** ![BBloomquist](https://d10pqhm3lwygmk.cloudfront.net/user_avatar/community.hubspot.com/bbloomquist/32/84335_2.png) [@BBloomquist](https://community.hubspot.com/u/BBloomquist)\ **Post date:** [June 13, 2022, 10:52pm UTC](https://community.hubspot.com/t/cta-custom-hover-color/10896/6 "2022-06-13T22:52:13Z")
The CTA Editor is definitely becoming outdated. I’ve been disappointed by the silly options to add texture to custom CTAs while we can’t customize the shape and hover colors to match the rest of the buttons on our landing pages. CTA editor is due for an update! 👏👏👏