Categories

← View All Tools

Heatmap Generator

Generate customizable heatmaps from data, perfect for visualizing data density, correlations, and patterns

Data for the heatmap. Supports JSON object with rows/columns/data or CSV format

Title that will be displayed above the chart

Custom color gradient (comma-separated hex colors, requires Custom scheme)

Size of each heatmap cell in pixels

Padding between cells in pixels

Minimum value for color scale (leave empty for auto)

Maximum value for color scale (leave empty for auto)

Background color for the chart container

Display values inside the heatmap cells

Display labels for rows and columns

Round values to whole numbers for display

Display color scale legend below the chart

Key Facts

Category
Data Visualization
Input Types
textarea, text, select, number, color, checkbox
Output Type
html
Sample Coverage
4
API Ready
Yes

Overview

The Heatmap Generator is a powerful data visualization tool that transforms raw numerical data into intuitive, color-coded heatmaps, making it easy to identify patterns, correlations, and density at a glance.

When to Use

  • •When you need to visualize complex matrix data to identify trends or outliers.
  • •When comparing performance metrics across multiple categories or time periods.
  • •When you want to create professional-grade visual reports from CSV or JSON datasets.

How It Works

  • •Input your data in either JSON format (with rows, columns, and data arrays) or CSV format.
  • •Customize the appearance by selecting a color scheme, adjusting cell size, and toggling labels or values.
  • •Set specific minimum and maximum values to define the color scale range for your data.
  • •Generate and preview your interactive heatmap directly in your browser.

Use Cases

Analyzing website traffic patterns across different days of the week and hours.
Visualizing correlation matrices for financial or scientific research datasets.
Creating performance heatmaps for employee KPIs or sales team regional targets.

Examples

1. Weekly Activity Heatmap

Data Analyst
Background
An analyst needs to show peak user activity times for a web application.
Problem
Raw logs are difficult to interpret for stakeholders.
How to Use
Paste the hourly activity counts into the Chart Data field and select the 'Viridis' color scheme.
Example Config
{"rows": ["Mon", "Tue", "Wed", "Thu", "Fri"], "columns": ["9am", "12pm", "3pm", "6pm"], "data": [[10, 20, 30, 40], [15, 25, 35, 45], [20, 30, 40, 50], [25, 35, 45, 55], [30, 40, 50, 60]]}
Outcome
A clear, color-coded grid showing high-traffic periods in brighter colors, allowing for quick identification of peak hours.

2. Sales Performance Matrix

Sales Manager
Background
Comparing regional sales performance across four quarters.
Problem
Standard tables make it hard to spot underperforming regions quickly.
How to Use
Input quarterly sales figures in CSV format and use the 'Warm' color scheme to highlight high-revenue cells.
Example Config
chartTitle: 'Regional Sales Q1-Q4', colorScheme: 'warm', showValues: true
Outcome
A heatmap where high-performing regions are highlighted in red, enabling the manager to instantly see which regions require support.

Try with Samples

json, csv
CSV Samples
Sample CSV files with various data types, sizes, and complexity levels
preferred input family json,csv
json, csv
Python Samples
Essential Python code examples and Hello World demonstrations
preferred input family json,csv
json, csv
PDF Samples
Generated PDF samples from tools dated 2026-02-01 to 2026-02-10
preferred input family json
json
Postman Collections - API Testing
Comprehensive Postman collection examples including API testing, automation scripts, environment variables, mock servers, and advanced testing patterns for REST APIs
preferred input family json
json

Related Hubs

Json Convert Tools
Explore 100 json tools for convert workflows and compare closely related utilities quickly.
Csv Convert Tools
Explore 37 csv tools for convert workflows and compare closely related utilities quickly.
Json Tools
Explore 43 json tools for utility workflows and compare closely related utilities quickly.
Json Generate Tools
Explore 33 json tools for generate workflows and compare closely related utilities quickly.

FAQ

What data formats are supported?

The tool supports raw data input in either JSON object format or standard CSV format.

Can I use my own colors?

Yes, by selecting the 'Custom' color scheme, you can input a comma-separated list of hex color codes.

Is it possible to hide the numerical values inside the cells?

Yes, you can toggle the 'Show Values in Cells' checkbox to display or hide the data points.

How do I define the range of the color scale?

You can manually set the 'Min Value' and 'Max Value' fields to control the color intensity; otherwise, the tool will auto-calculate based on your data.

Can I download the generated heatmap?

The tool generates an HTML-based visualization that can be viewed and captured directly from your browser.

API Documentation

Request Endpoint

POST /en/api/tools/heatmap-generator

Request Parameters

Parameter Name Type Required Description
chartData textarea Yes Data for the heatmap. Supports JSON object with rows/columns/data or CSV format
chartTitle text No Title that will be displayed above the chart
colorScheme select No -
customColors text No Custom color gradient (comma-separated hex colors, requires Custom scheme)
cellSize number No Size of each heatmap cell in pixels
cellPadding number No Padding between cells in pixels
minValue number No Minimum value for color scale (leave empty for auto)
maxValue number No Maximum value for color scale (leave empty for auto)
backgroundColor color No Background color for the chart container
showValues checkbox No Display values inside the heatmap cells
showLabels checkbox No Display labels for rows and columns
roundValues checkbox No Round values to whole numbers for display
showColorScale checkbox No Display color scale legend below the chart

Response Format

{
  "result": "
Processed HTML content
",
  "error": "Error message (optional)",
  "message": "Notification message (optional)",
  "metadata": {
    "key": "value"
  }
}
HTML: HTML

AI MCP Documentation

Add this tool to your MCP server configuration: 

{
  "mcpServers": {
    "elysiatools-heatmap-generator": {
      "name": "heatmap-generator",
      "description": "Generate customizable heatmaps from data, perfect for visualizing data density, correlations, and patterns",
      "baseUrl": "https://elysiatools.com/mcp/sse?toolId=heatmap-generator",
      "command": "",
      "args": [],
      "env": {},
      "isActive": true,
      "type": "sse"
    }
  }
}

You can chain multiple tools, e.g.: `https://elysiatools.com/mcp/sse?toolId=png-to-webp,jpg-to-webp,gif-to-webp`, max 20 tools.

If you encounter any issues, please contact us at [email protected]