Customizing the style of action selectors in MicroStrategy can be tricky and, by default, we don’t have a lot of style options.

A good way of styling them is using CSS and that is super simple to do.

First, add a HTML Container in the document where you have your Action Selectors (it can be either a button or a link) and set it to use HTML Text instead of IFRAME.

Go to this website: https://www.bestcssbuttongenerator.com/ and generate your own button style.

Then, copy the properties and add them with these classes:

.mstrmojo-DocSelector div, .mstrmojo-DocSelector table, .mstrmojo-DocSelector tbody, .mstrmojo-DocSelector tr, .mstrmojo-DocSelector td, .mstrmojo-DocSelector input, .mstrmojo-DocSelector {
    // the properties go here…
}

Now, make sure to add !important in every property that you used and add the custom style tags. Here is an example:

<style type="text/css">
.mstrmojo-DocSelector div, .mstrmojo-DocSelector table, .mstrmojo-DocSelector tbody, .mstrmojo-DocSelector tr, .mstrmojo-DocSelector td, .mstrmojo-DocSelector input, .mstrmojo-DocSelector {
    display: inline-block !important;
    background:linear-gradient(to bottom, #44c767 5%, #5cbf2a 100%) !important;
    background-color:#44c767 !important;
    border-radius:28px !important;
    border:0px solid #18ab29 !important;
    cursor:pointer !important;
    color:#f5f5f5 !important;
    font-family:Arial !important;
    font-size:17px !important;
    text-decoration:none !important;
    text-shadow:0px 1px 0px #2f6627 !important;
    padding-top: 1px !important;
}
</style>

A screenshot of a cell phone Description automatically generated

 

Now you have your own styled action selector button/link.