Skip to main content

Documentation Index

Fetch the complete documentation index at: https://domoinc-jkreitzman-patch-1.mintlify.app/llms.txt

Use this file to discover all available pages before exploring further.

Domo adheres to Material Design principles, and we highly encourage that you consider these same principles when building a Domo app as they will ensure a seamless transition from Domo to your app. Please be familiar with the following principles and guidelines as you design your app:

​
Domo Color Palette

You’re welcome to use the color palette of your choice when designing your app; however, designers will often want to design the app to look and feel more like native Domo. If that’s the route you want to take, we’ve provided the basic Domo color palette for your reference.

​
Domo Blue Palette

#ffffff#f2f8fc#dcedf8#c8e2f4#b2d7f0#99ccee

​
Gray Palette

#f6f6f6#eeeeee#d4d4d4#888888#555555#333333

​
Button Palette

BorderBackgroundBackground:HoverBackground:Active
#ccccccrgba(255,255,255,0.5)#f8f8f8#e6e6e6
#fc9927#fc8f13#fc8f13#ed8003
#cb2c1c#cb2c1c#b9281a#9e2216
#4b87b0: Default#43799e: Hover

​
Chart Palette

Colors
#d9ebfd#b7daf5#90c4e4#72b0d7#4e8cba#31689b
#ddf4ba#bbe491#a0d771#80c25d#559e38#347b26
#fdecad#fccf84#fbad56#fb8d34#e45621#a43724
#f3e4fe#ddc8ef#c5acde#b391ca#8f6dc0#7940a1
#d8f4de#8be4ca#8dd5be#69bea8#46998a#227872
#fcd7e6#fbb6dd#f395cd#ee76bf#cf51ac#a62a92
#fddddd#fcbcb7#fd9a93#fd7f76#e45850#c92e25

​
Rules

When coloring multi-series charts, be sure to alternate the color saturation. Choosing colors with the same saturation will eliminate contrasts, creating unnecessary eye strain. Bad Example
#b7daf5#bbe491#fccf84#ddc8ef#abe4ca#fbb6dd
Good Example
#90c4e4#4e8cba#a0d771#559e38#fbad56#e45621

​
Typography

Domo’s typography foundation lies in traditional typographical measures, utilizing a 6px baseline grid. All pages are designed using spacing units of 6 between different components. This creates a pleasing and predictable vertical rhythm and extends to our horizontal grid as well. Again, you’re not required to use Domo styling in your app, but many designers have requested these guides in order to design their app to look and feel more like Domo.
Jumbo
Size/Leading: 64/72 • Weight: Light 300
The quick, brown fox
Display-1
Size/Leading: 36/48 • Weight: Light 300 • 80% Black
The quick, brown fox
Display-2
Size/Leading: 30/42 • Weight: Light 300 • 80% Black
The quick, brown fox
Display-3
Size/Leading: 24/32 • Weight: Light 300 • 80% Black
The quick, brown fox
Display-4
Size/Leading: 20/28 • Weight: Regular 400 • 80% Black
The quick, brown fox
Display-5
Size/Leading: 18/24 • Weight: Regular 400 • 80% Black
The quick, brown fox
Display-5-Secondary
Size/Leading: 18/24 • Weight: Regular 400 • 40% Black
The quick, brown fox
Display-6
Size/Leading: 16/20 • Weight: Semibold 600 • 80% Black
The quick, brown fox
Display-6-Secondary
Size/Leading: 16/20 • Weight: Semibold 600 • 40% Black
The quick, brown fox
Body
Size/Leading: 14/20 • Weight: Regular 400 • 80% Black
Lorem ipsum dolor sit amet, an usu nobis munere. Tractatos definitiones ius ea, soluta diceret accusamus sed ei. Sint eripuit epicuri ut eam, inani tractatos prodesset sea ea, eum eu graecis lucilius. Sapientem molestiae ex cum, ius an habeo blandit, tamquam feugait no sea. Quo eu inermis deseruisse. Est ex quem viderer.
Body-Secondary
Size/Leading: 14/20 • Weight: Regular 400 • 40% Black
Ut accusam placerat nec, convenire inciderint te his. Audiam molestie et sea, usu in inani docendi, wisi dictas percipitur an mel. Assum denique aliquando eos te, vel an putent denique ancillae. Nam cu sumo meis impetus.
Caption
Size/Leading: 12/16 • Weight: Regular 400 • 80% Black
Pri ad decore persecuti, ea cibo semper accusata sed. Legimus oportere nec ea, pro causae mollis constituto ei. Sed et cetero dissentiet suscipiantur. Ex est quis aliquam, vero nobis omittam sit te. Nibh falli id cum.
Caption-Secondary
Size/Leading: 12/16 • Weight: Regular 400 • 40% Black
Lorem ipsum dolor sit amet, mel sonet congue possit at, vel choro tamquam necessitatibus an. Illud suscipiantur definitionem eum no, putent argumentum cum et. Duo atomorum antiopam id, dicam utamur appellantur ex sit. Clita dictas quaestio id mel. Per eleifend electram ne.
Micro
Size/Leading: 11/14 • Weight: Regular 300 • 40% Black
Regione suscipit laboramus vel ne, ne diam reformidans eam. Pro quas suavitate eu, oblique fierent vis in. Sea dicta consequat te, nonumy urbanitas voluptaria has no. Quo dolorum molestiae adversarium ad, zril corpora eos ea, has ut perfecto erroribus. Iusto quidam contentiones vim ne, ius ut idque habemus. Ne meis phaedrum pri.
Label
Size/Leading: 11/14 • Letter Spacing: 1 • Weight: Semibold 600 • 40% Black
Eu repudiare similique vix. Lorem ceteros ad vix. Libris tritani deserunt quo id, case audire sed eu. Ad adhuc assentior usu, has unum partem moderatius ex, eu sea alia salutandi ullamcorper. In quot reque voluptatibus quo, everti aperiam civibus no his.
Label-Field
Size/Leading: 12/14 • Weight: Semibold 600 • 40% Black
Mea causae impetus ne. Minim fabulas saperet ea pro, eripuit invidunt cum ex. An dicunt platonem duo. Vis at sonet quaeque, fastidii conceptam sea cu, pro choro impetus ea. Et mei tota graece nemore.