SurveyJS v3.0 Is Here

We're excited to announce the official release of SurveyJS v3.0 — a major update focused on UI customization, visual consistency, and seamless integration with your application.

With v3.0, we introduced a new styling foundation across the entire product family, redesigned the Dashboard component, significantly improved PDF workflows, and added a new no-code customization tool for the Survey Creator UI.

But most importantly, SurveyJS v3.0 makes it dramatically easier to align SurveyJS with your product's existing design system, with ready-made support for Bootstrap, Material UI, and shadcn/ui.

Let's take a look at what's new.

Design Tokens — A New Styling Foundation for SurveyJS

SurveyJS v3.0 introduces a new design token system for the entire product family.

SurveyJS libraries — Form Library, Survey Creator, PDF Generator, and Dashboard — now share the same set of CSS variables, making it easier to apply common themes across products and maintain a more consistent visual experience.

Inspired by scalable design token architectures, this new foundation lays the groundwork for a more flexible and maintainable approach to customization.

What does this mean for teams building with SurveyJS?

• More consistent styling across products
• Easier theme sharing between libraries
• A stronger foundation for deeper customization
• Better alignment with modern design systems

Ready-to-Use Theme Adapters

One of the biggest goals behind v3.0 was solving a long-standing challenge for embedded UI components: making SurveyJS visually blend into your application without days or even weeks of manual styling.

SurveyJS v3.0 introduces ready-to-use style adapters for applications built with popular CSS frameworks and design systems.

Launch support includes:

• Bootstrap
• Material UI
• shadcn/ui

These adapters are CSS mapping files that connect the variables used by the host design system to the corresponding SurveyJS design tokens with minimal CSS work. Simply add the SurveyJS CSS mapping file to your application and SurveyJS components will automatically pick up its visual language — typography, spacing, colors, control states, surfaces, and interactions.

In cases where framework values are hard-coded in CSS or component logic rather than exposed through variables, SurveyJS intentionally mirrors those defaults to preserve visual consistency.

So if your application uses Bootstrap, Material UI, or shadcn/ui defaults, SurveyJS should now immediately feel like a natural part of your product.

Dashboard — Better Analytics with Less Setup

Dashboard received a major update in v3.0 — both visually and architecturally.

We redesigned layouts, spacing, and visual elements to create a cleaner, more modern experience aligned with the rest of the SurveyJS ecosystem.

We also introduced Chart.js as the new default charting engine for lighter bundles, easier styling, and better visual consistency.

New built-in capabilities include:

• Date filtering with intuitive presets such as Last 7 days, This month to date, and custom ranges
• Interactive cross-filtering, where selections in one widget instantly update related charts and tables
• State-based configuration, allowing dashboards to be defined, saved, and reused through a single state object

The result is less setup, easier reuse, and more interactive reporting experiences.

PDF Generator — Better Alignment, More Control

PDF workflows are critical for many teams, and v3.0 makes them far more flexible, visually consistent, and easier to customize.

Web and PDF Are Now Better Aligned

PDF output now more closely reflects the appearance of your web forms. Fonts, spacing, colors, and layouts work together more consistently, helping exported PDFs better match the look and feel of your application.

CSS-Based Styling for PDFs

PDF styling now uses the same CSS variable foundation as the rest of SurveyJS.

This means:

• Colors, typography, spacing, and borders are no longer hard-coded
• PDF appearance can inherit from your active theme
• Branding becomes easier to maintain across web and PDF outputs

We also introduced a clearer separation between Theme and Layout variables. Theme variables define colors and shadows, while layout variables control spacing, typography, borders, and document structure. This gives teams independent control over branding and document formatting while keeping web and PDF experiences visually aligned.

New Layout Presets & Fine-Grained Styling

SurveyJS v3.0 introduces two built-in layout presets: Compact for denser forms and Spacious for more presentation-friendly documents, along with a new styles configuration system for precise control over survey titles, questions, labels, containers, matrices, and spacing.

Complex question types and advanced layouts now also render more cleanly in PDF.

Survey Creator, Your Way

Survey Creator v2.0 focused on visuals. In v3.0, we focused on control.

Meet the UI Preset Editor — a no-code control panel that lets teams configure Survey Creator's UI and behavior, preview changes instantly, and export reusable JSON presets.

From shaping the Toolbox and functional tabs to tailoring the Property Grid and editor behavior, Survey Creator now adapts to your workflow — not the other way around.

Configure once, reuse anywhere — the UI Preset Editor helps teams standardize and share Survey Creator configurations across projects.

Explore SurveyJS v3.0

SurveyJS v3.0 is now available, and we're excited to finally share it with you.

Whether you're looking for tighter design-system alignment, easier customization, more consistent PDF workflows, or more powerful dashboards, v3.0 helps SurveyJS feel more like a natural part of your product.

As always, your feedback helps shape what comes next, so let us know what you think!

Thanks for building with SurveyJS ❤️