Skip to main content
Ember Stacked
BoldBarReport

Ember Stacked

Bold warm-toned stacked bar on a near-black background. Commanding presence for financial reports.

Open in Studio

Theme tokens

Background
#1a0f02
Font
Inter / 12px
Mode
dark

API snippet

POST this to /api/v1/render to render this template programmatically.

POST /api/v1/render
Content-Type: application/json
Authorization: Bearer YOUR_API_KEY

{
  "type": "bar",
  "width": 800,
  "height": 420,
  "format": "png",
  "data": {
    "labels": [
      "Q1",
      "Q2",
      "Q3",
      "Q4"
    ],
    "datasets": [
      {
        "label": "APAC",
        "data": [
          142,
          181,
          219,
          264
        ],
        "backgroundColor": "#fb923c",
        "borderRadius": 4,
        "borderSkipped": false
      },
      {
        "label": "EMEA",
        "data": [
          98,
          124,
          157,
          193
        ],
        "backgroundColor": "#fbbf24",
        "borderRadius": 4,
        "borderSkipped": false
      },
      {
        "label": "Americas",
        "data": [
          211,
          248,
          297,
          341
        ],
        "backgroundColor": "#f97316",
        "borderRadius": 4,
        "borderSkipped": false
      }
    ]
  },
  "options": {
    "color": "#d97706",
    "plugins": {
      "legend": {
        "position": "top",
        "align": "start",
        "labels": {
          "color": "#fcd34d",
          "usePointStyle": true,
          "padding": 16
        }
      },
      "title": {
        "display": true,
        "text": "Revenue by Region ($k)",
        "color": "#fef3c7",
        "font": {
          "size": 14,
          "weight": "bold"
        }
      }
    },
    "scales": {
      "x": {
        "stacked": true,
        "grid": {
          "display": false
        },
        "border": {
          "display": false
        },
        "ticks": {
          "color": "#92400e"
        }
      },
      "y": {
        "stacked": true,
        "grid": {
          "color": "rgba(251, 146, 60, 0.1)"
        },
        "border": {
          "display": false
        },
        "ticks": {
          "color": "#92400e"
        }
      }
    }
  },
  "theme": {
    "palette": [
      "#fb923c",
      "#f97316",
      "#fbbf24",
      "#fcd34d",
      "#f87171",
      "#ef4444"
    ],
    "backgroundColor": "#1a0f02",
    "fontFamily": "Inter",
    "fontSize": 12,
    "gridColor": "rgba(251, 146, 60, 0.12)",
    "mode": "dark"
  }
}

More Bar templates