Since Excel was first released for the Mac in 1985 it has become the workhorse for analysts across all industries. For weekly reporting however, it can be a drag to pull a report into excel, apply conditional formatting, and distribute it to multiple people on a regular basis.

Often when businesses are trying to evaluate data in a spreadsheet or table, it can be challenging to determine how individual items/rows are performing at a glance. Conditional formatting in excel allows you to highlight information when your own business conditions are met. In the example below, I’ve used data from Google Adwords to create “CPA” from the Cost / Conv. data field.

By highlighting items where Cost per Acquisition or “CPA” is greater than $10.00 in Red, and items where CPA is less than $5.00 in green, I can now see which campaigns are cheaper or more expensive to acquire customers. While this is rather simple to do with a few buttons in excel, it’s not a standard table format in Domo.

Luckily with some tweaking, we can enhance Domo’s Table chart type with Beast Modes that include HTML & CSS to apply our own conditional formatting to reports. This works for all standard (non-Sumo tables).

How to Implement:

We can do this by combining the SQL CONCAT function with an HTML DIV element. Because HTML & CSS are rendered in the browser, we can now change the background color based on user defined conditions. We could also load other elements like image files (ex. custom indicator icons).

Beast Mode Format: CONCAT(‘html’,@field,’html’)
Beast Mode


    WHEN `Cost / conv.` > 10
        THEN CONCAT('<div style="background-color:#fcbcb7; text-align: right; text-decoration:none; font-weight: bold; width: 100%; height:100%; margin:-20px; padding:20px;"><a href="#">','$',`Cost / conv.`, '</a></div>')

    WHEN `Cost / conv.` < 5
        THEN CONCAT('<div style="background-color:#bbe491; text-align: right; font-weight: bold; width: 100%; height:100%; margin:-20px; padding:20px"><a href="#">','$',`Cost / conv.`, '</a></div>')

  ELSE CONCAT('<div style="background-color:#fccf84; text-align: right; font-weight: normal; width: 100%; height:100%; margin:-20px; padding:20px"><a href="#">','$',`Cost / conv.`, '</a></div>')

Uses for Conditional Formatting:

  • Highlight Duplicate or Unique Values
  • Highlight Min, Max, Median Values
  • Monitor Overages/Underages

The Possibilities Are Endless

The ability to add HTML & CSS opens up several other capabilities in Domo. Here are some other ideas for using HTML & CSS to extend Domo Functionality.

  • Create Multiple/Custom Summary Numbers
  • Create a Clickable Blog Roll From an RSS connector
  • Create a Social Media Monitoring Dashboard with Facebook Image Snippets or Twitter User Icons (As seen in facebook, twitter, or instagram quickstarts)

Let us know what you think. Have Domo questions or challenges? Drop us a note at

Contact Us

Related Posts

Join the Conversation

Check out Kelly Wortham’s Optimization based YouTube channel: Test & Learn Community.

Search Discovery
Education Community

Join Search Discovery’s new education community and keep up with the latest tools, technologies, and trends in analytics.




Scroll to Top


Catch the latest industry trends we’re watching and get new insights from our thought leaders delivered directly to your inbox each month.