Get Started with Blazor PDF Viewer

• Mar 25, 2026
• 3 minutes to read

This topic describes how to create a new project or configure an existing project to use a DevExpress Blazor PDF Viewer component.

Create a New Project (DevExpress Template Kit)

Follow this tutorial to create a Blazor application using the DevExpress Template Kit. To add a PDF Viewer to the application, choose the corresponding option in the Kit.

Configure an Existing Project

Follow the steps below to incorporate a PDF Viewer into an existing Blazor app.

Register Common DevExpress Resources

Create an application as described in the following topic: Get Started With DevExpress Components for Blazor.

Register PDF Viewer Resources

1. Install the DevExpress.Blazor.PdfViewer NuGet package.

2. Register the DevExpress.Blazor.PdfViewer namespace in the _Imports.razor file:

3. Register the DevExpress.Blazor.Reporting.Models namespace to access and modify toolbar settings.

4. Register the PDF Viewer-related services in the Program.cs file:

5. Register the PDF Viewer’s CSS file:

WebAssembly Specifics

To use the DevExpress Blazor PDF Viewer in WebAssembly and .NET MAUI Blazor Hybrid applications, complete the following steps:

1. Set the PdfPrintingOptions.RenderingEngine property to Skia.
2. Install WebAssembly Build Tools workloads for each .NET SDK that you plan to target.
3. Install the following NuGet packages:

• DevExpress.Pdf.SkiaRenderer
• SkiaSharp.NativeAssets.WebAssembly
• HarfBuzzSharp.NativeAssets.WebAssembly

Non-Windows Environment Specifics

For non-Windows environments ( Linux , macOS , and Azure/AWS cloud platforms), install the DevExpress.Pdf.SkiaRenderer NuGet package. For additional information, refer to Use Reporting on Linux and macOS.

On Linux , you must also install the following font libraries:

• Ubuntu
• Debian
• CentOS / RHEL / Fedora
• openSUSE
• Alpine

sudo apt-get install -y libc6 libicu-dev libfontconfig1

sudo apt-get install -y libc6 libicu-dev libfontconfig1

sudo yum install -y glibc-devel libicu fontconfig

sudo zypper install -y libicu fontconfig

sudo apk add icu-libs icu-data-full fontconfig

For applications on Windows Azure , set the PdfPrintingOptions.RenderingEngine property to Skia (see XRPdfContent Control Specifics).

Add a PDF Viewer Component

Follow the steps below to add a PDF Viewer Component:

1. Add the following markup to a .razor file: <DxPdfViewer>…</DxPdfViewer>.
2. Enable interactive render mode. Refer to Static Render Mode Specifics.
3. Specify a document to open.
4. Configure the component as your needs dictate. For additional information, refer to the DxPdfViewer class description.

<DxPdfViewer DocumentContent="DocumentContent"
             ZoomLevel="1" />

@code {
    byte[]? DocumentContent { get; set; }

    protected override async Task OnInitializedAsync() {
        await base.OnInitializedAsync();

        await using Stream stream =
            System.Reflection.Assembly.GetExecutingAssembly()
            .GetManifestResourceStream("PDFViewerServer.Documents.Invoice.pdf")
            ?? throw new InvalidOperationException("Resource not found.");
        using MemoryStream ms = new();
        await stream.CopyToAsync(ms);
        DocumentContent = ms.ToArray();
    }
}