React PDFViewer

  • Allow users to view PDF documents directly in your app without the need for third-party software or plug-ins.
  • Part of the KendoReact library along with 100+ professionally-designed components.
  • Includes support, documentation, demos, virtual classrooms, learning resources and more!
  • Embed PDF Preview into Your React Apps

    The KendoReact PDFViewer component allows users to view and interact with PDF files directly in the browser, without needing to download the file or use third-party tools or browser extensions. The PDFViewer control will significantly impact productivity and efficiency for developers that deal with software modules or entire applications for document management. The PDFViewer includes a toolbar with built-in features to open, view, and download PDF files, paging, PDF search options, zoom in/out, printing, and more. You can further customize the built-in commands and expand the toolbar with new ones such as adding a watermark or sending via email.

    See the React PDFViewer demo

    PDFViewer Overview
  • Toolbar and Built-in Tools

    The PDF Viewer provides a configurable toolbar to help users interact. You can choose to enable and disable a combination of built-in tools or you can add your own. Built-in tools include: 

    • pager
    • zoom
    • selection
    • search
    • open
    • download
    • print

    See the React PDFViewer Toolbar demo

    pdfviewer toolbar
  • Events

    The KendoReact PDFViewer component supports different events to enable you to easily handle file operations logic in any React app.

    See the React PDFViewer Events demo

  • Globalization

    Like the rest of KendoReact, the PDFViewer makes globalization easy through the following features:

    • Internationalization The component's UI will comply with culture settings. Number and currency formatting are common examples.
    • Right-to-left support: Items in the component UI will automatically layout right to left. 
    • Messages: Messages are easily translated.

    See the React PDFViewer Globalization demo

  • Custom Rendering

    The React PDFViewer exposes three events that allow you to customize its three primary nested components. These items are customizable: 

    • Toolbar: Add custom tools to the default toolbar.
    • Content: Override and configure the content displayed in the viewer
    • Loader: Use your own loading animation that appears as the document is loading.

    See the React PDFViewer Custom Rendering demo

  • Accessibility

    The KendoReact PDFViewer component has extensive accessibility support and enables users with disabilities to have complete control over its features.

    The React PDFViewer component is compliant with the Web Content Accessibility Guidelines (WCAG) 2.1 AA standards and Section 508 requirements. It also follows the Web Accessibility Initiative - Accessible Rich Internet Applications (WAI-ARIA) best practices for implementing the keyboard navigation for its component role and delivers different options for managing its focus.

    Learn more about the React PDFViewer Accessibility

  • Other Supported Frameworks

    The PDFViewer component is also available for these web development frameworks:

Frequently Asked Questions

  • Where can I find the KendoReact PDFViewer demo?

    You can find the KendoReact PDFViewer demo here.  

  • How do I get started with the KendoReact PDFViewer?

    Getting started is easy. Visit the KendoReact PDFViewer Getting Started tutorial for an easy step-by-step tutorial. All you need to do is install the NPM package, add the component to a page, and set desired properties!  

    Don’t forget to sign up for a trial of the KendoReact components library. This gives you a 30-day license and access to support resources to help you during your learning and evaluation process. 

  • Why would I need a PDFViewer component?

    The KendoReact PDFViewer component enables you to access, open, download and view PDF files in-browser, without the need for installing any extensions or third-party tools. The control positively impacts your efficiency and productivity when dealing with software modules or entire applications for document management.

  • How can I try the KendoReact PDFViewer component?

    You can try all KendoReact Components by signing up for a 30-day trial. During your evaluation, you will have access to all the components, technical support, documentation and on-demand technical training.   

    See the KendoReact PDFViewer Getting Started article for a quick tutorial.  Also, don’t forget to sign up for a trial of the KendoReact components library to get free support. 

  • How can I buy the KendoRect PDFViewer?

    The KendoReact PDFViewer component is one of over 100 in the KendoReact component library which is part of the Kendo UI bundle. Kendo UI includes libraries for jQuery, Angular, React, and Vue. You can purchase Kendo UI online or by contacting sales.   

    You can also choose to purchase DevCraft, which bundles all our .NET and JavaScript components. 


  • Why should I choose the KendoReact PDFViewer component?
    • All KendoReact components are built from the ground up for React 
    • The component is highly customizable and can be easily modified to suit your needs. 
    • It is one of over 100 other components in our React components library that developers use to build modern, consistent UI.   
    • As a commercial product, it is frequently updated for React compatibility and user demand by a full-time team of experts.    
    • Our support team consistently wins accolades from industry organizations and users themselves.  
    • Each feature is meticulously documented. 


All KendoReact Components

Next Steps