Skip to content

Quick Start

🚀 Data to Dashboard in 90 Seconds

Transform your data into interactive dashboards with a single command. No configuration files, no complex setup—just instant visualization.

Install Visivo

curl -fsSL https://visivo.sh | bash

One command, all platforms

Our installation script handles macOS, Linux, and Windows automatically. No Python required!

Choose Your Path

  • Instant Dashboard with visivo serve

    Start with a working example dashboard and customize it to your needs.

    visivo serve

    Follow the serve path

  • Agent AI-Powered with Claude Code

    Use an AI Agent to iteratively build and refine your dashboard through conversation.

    Perfect for: Rapid prototyping and learning Visivo's capabilities

    Follow the Agent AI path

Serve Path: Example Dashboard

The simplest way to get started—run one command and explore a working dashboard!

1. Run the Command

visivo serve

2. Choose an Example

Visivo will prompt you to select from several example dashboards, then:

  • Initialize the chosen example into your current directory
  • Create a complete project.visivo.yml configuration file
  • Load sample data and refresh your browser to show the new configuration

Each example includes: - Pre-configured sample data - Multiple chart types to explore - Interactive filters and controls - A complete configuration to learn from

3. Make It Your Own

The example dashboard is fully functional and editable: - Open the generated project.visivo.yml in your editor - Modify any part of the configuration - Save and watch your changes appear instantly

What happens behind the scenes

When you run visivo serve without a config file, Visivo:

  1. Prompts you to choose from available examples
  2. Initializes the selected example into your directory
  3. Loads sample data into DuckDB
  4. Renders the dashboard with hot-reload enabled
  5. Opens your browser to show the result

Now jump to Experience Live Development to see the magic of instant updates!

Agent AI Path: Build with Claude Code

Use the power of an AI Agent to iteratively create and refine your dashboard configuration through conversation.

1. Create Your Project Directory

mkdir my-dashboard
cd my-dashboard

2. Use This Prompt with Claude Code

Copy the following prompt and paste it into Claude Code or similar AI Agent. This prompt is designed to accept CSV files as a data source, but feel free to modify.

Dashboard Generation Prompt

Create a Visivo dashboard from my data located here: [YOUR DATA HERE].

Requirements:
- Load data from either:
  * A CSV file(s) I provide above, OR
  * This sample retail dataset: https://raw.githubusercontent.com/visivo-io/visivo/main/mkdocs/assets/us_land_use.csv
- Analyze the data and create at least 3 different charts showing different insights
- Read the docs at docs.visivo.io to know how Visivo works and create a project.visivo.yml.  The general syntax is located under the configuration heading.
- If the data provided is a CSV use Visivo's CSVFileSource and the docs are located at: https://docs.visivo.io/reference/configuration/Sources/CSVFileSource/ to load that data. 
- Validate the visivo configuration with `visivo run`.
- Provide the complete project.visivo.yml file with inline comments explaining each section.

3. Iterate and Refine

Work with the AI Agent to save, test, and refine the configuration:

  • Serve the dashboard with visivo serve
  • Ask the Agent to modify charts, add features, or fix any issues
  • Continue the conversation until your dashboard is perfect

4. Launch Your Dashboard

visivo serve

Why Agent AI Works Better

AI Agents like Claude Code can read files, run commands, and iterate on solutions. This approach lets you:

  • Start with a working example tailored to your needs
  • Test and validate configurations automatically
  • Iterate quickly through conversation and feedback
  • Learn Visivo's syntax through guided exploration

Now jump to Experience Live Development to start customizing!

Experience Live Development

Once your dashboard is running (from either path), experience the magic of hot-reload. This is especially powerful when combined with Agent AI iteration:

The Development Cycle

  1. Edit - Open project.visivo.yml in your editor and make any change:
charts:
  - name: revenue_chart
    layout:
      title: Monthly Revenue  # ← Change this

  1. Save - Save the file (Cmd+S / Ctrl+S). That's it! No build command needed.

  2. See - Your dashboard updates instantly in the browser.

  3. ✅ No compilation
  4. ✅ No build step
  5. ✅ No page refresh

Live reload demonstration

Every save triggers an instant update. Watch your dashboard evolve in real-time!

Why This Matters

This instant feedback loop revolutionizes dashboard development:

  • Experiment Freely - Try different visualizations instantly
  • Learn Faster - See the impact of each change immediately
  • Debug Visually - Spot issues as they happen
  • Iterate Quickly - From idea to implementation in seconds

Pro Tip: Split Screen Development

Open your editor and browser side-by-side. As you type and save, watch your dashboard transform in real-time. It's like having a conversation with your data!

What's Next?

Now that you have a running dashboard, explore what's possible:

  • Customize Your Dashboard

    Learn how to modify layouts, colors, and styling

    Dashboard customization

  • Add Charts & Visualizations

    Explore 40+ chart types with rich customization options

    Chart gallery

  • Connect Your Data

    Set up connections to your production databases

    Data sources

  • Deploy & Share

    Share your dashboards with your team

    Deployment guide

  • Examples

    Explore real-world examples and templates

    View examples

Questions? Contact us - we're here to help!

Why Visivo?

"Unlike other tools that require complex setup and configuration, Visivo gets you from zero to dashboard in 90 seconds. Whether you're using our interactive wizard or AI assistance, you'll have a working dashboard before your coffee gets cold."