Skip to main content

​
What are Domo Bricks?

Domo Bricks are pre-built objects that allow you to find and act more quickly on custom business insights. With Domo Bricks, business users, citizen developers, and full stack developers can quickly iterate, prototype and compose new apps with beautiful and advanced features to discover new insights from custom visualization and interactions. You can choose from Bricks available in the Domo Appstore or you can also use Domo Bricks to render a new library you found online — it’s as easy as copy and paste. Domo Bricks lets you use HTML, CSS and JS to completely customize your app. These new custom solutions visuals are immediately rendered and can be easily updated all within your Domo instance. Now there is a seamless path for business users to progress from out-of-the box app building constraints to scalable, powerful, customized objects that extend Domo to meet any business need.

​
Example Use Cases

​
Domo Bricks allow you to:

  • Quickly prototype and iterate from an infinite number of possible business applications
  • Build an application from scratch using HTML, CSS and JS tied to Domo data
  • Copy and paste examples from the web to customize your dashboard
  • Build a brand new chart type by using your favorite UI library tied to Domo data
  • Leverage D3 snippets to create innovative new data visualizations or specialized UI components
  • Edit in real-time with the Domo script box to quickly perfect your app
  • Easily connect to any dataset available in Domo or use sample data to start building
  • Share and reuse the solutions you build across your organization
  • Create custom navigation menus, drag and drop Domo Bricks into layouts and dashboards, and add Domo Bricks to automated features in Domo like scheduled reports

​
Available Domo Bricks

​
Form Input:

Makes it easy to gather input from your teams in one place. domo-form-brick.png

​
Todo:

Allows you to build and share a to-do list that all can update. todo-brick.png

​
Calendar:

Helps you visualize and share a dynamic calendar with your team. calendar-brick.png

​
Gantt chart:

Enables on-the-fly changes to keep your projects on track gantt-brick.png

​
D3.js pie, line and bar charts:

Use the D3 library to add custom visualizations tied to your Domo data portalbrick

​
Mapbox:

Build beautiful and powerful street-level maps and interactions tied to your Domo data using the MapBox library portalbrick2

​
Images:

Bring images to liven up your Dashboards. top10imagebrick.png

​
Voronoi map:

A 3D world map that allows you to interact and scroll in all directions. voronoibrick.png

​
Data Exploration:

If you like raw SQL to explore data there are two bricks that show a chart or just the csv results of your SQL query sqlchartbrick.png

​
SugarForce CRM:

A sample CRM brick that is used throughout app documentation. sugarforcebrick.png

​
More available Domo Bricks:

  • Custom HTML: See how to create a card using HTML from examples you find on the web
  • Leaflet map: Choose from one of over 30 map looks to instantly see modern maps with flare using the leaflet library
  • Phoenix pie, line and bar charts: Customize a card with HTML, CSS and JS while maintaining a consistent Domo chart experience by using the Phoenix library
  • Custom Tables: Customize your unique table views by using pre-built table libraries
  • Google map pinboard : See how to tie your domo data to the popular google map API
  • Vega visualization grammar : JSON format to describe visualization tied to your data
  • Observable interactive chart: Try one of the many interactive observable visuals and see how to integrate it with Domo
  • Navigation : Navigation examples to show how to use buttons or links to use bricks for site navigation
  • Animation: Analyze data interactively
  • Chart.js: Charts from Chart.js library
  • Play a chart : Push the play button to see how your data changes over time

​
Prerequisites

To start using Domo Bricks you will need:
  • A Domo account
  • Permission to create an app from the Domo Marketplace
  • Understanding of how to work with domo DataSets (for example how to build a card from a DataSet)
  • Basic understanding of HTML, CSS and JS are useful to fully customize Domo Bricks

​
Next Steps

Follow our walkthroughs for Getting Started with Domo Bricks.