Progress Telerik UI for Blazor

Blazor DropZone

  • Empower users to drag and drop files to a designated area on the web application or page leveraging Telerik UI for Blazor DropZone.
  • This component is part of Telerik UI for Blazor—the largest suite of truly native Blazor components designed to perfectly fit any app requirement.
  • The Blazor UI suite also comes with professionally designed themes enabled with a flip of a switch, document processing libraries and rich docs & demos to help you get started in no time.
Telerik UI for Blazor DropZone Component - Header image
  • Dragging and Dropping Made Simple

    The Telerik UI for Blazor DropZone component allows users to effortlessly drag and drop files to a specific area within a web application or page. This UI control elevates the overall user experience by automatically transferring the selected file or image from the designated zone.

    See the Telerik UI for Blazor DropZone overview demo

    Telerik UI for Blazor DropZone-Overview
  • Seamless FileSelect and Upload Integration

    Leveraging the Telerik UI for Blazor DropZone component, users can declare an external drop zone for an existing FileSelect or Upload component thanks to the native integration between the components. Simply match the value of the DropZone Id parameter with the DropZoneId parameter of the FileSelect or Upload components.

    Learn more in the Telerik UI for Blazor DropZone documentation

    Telerik UI for Blazor FileSelect-DropZone Integration
  • DropZone Template

    The Telerik UI for Blazor DropZone component enables you to render the arbitrary content inside the component leveraging the Template parameter. The Template is a RenderFragment and allows you to add any custom content required, such as simple text, HTML elements or other components.

    See the Telerik UI for Blazor DropZone Template demo

    Telerik UI for Blazor DropZone-Template
  • Appearance

    Apply custom CSS styles to the Blazor DropZone component when the user is dragging over it by leveraging the DragOverClass parameter. You can also customize the width and height of the DropZone component to align it with your design requirements or personal preferences.

    The DropZone component also features customizable and localizable hint and note parameters:

    • HintText outlines the text for the DropZone hint. when such text is not provided, the DropZone will render a default value—"Drag and drop files here to upload."
    • NoteText is an optional content placeholder inside the DropZone. You can use it to render any additional information below the hint.

    See the Telerik UI for Blazor DropZone documentation

    Telerik Ui for Blazor DropZone-Overview

All Blazor Components

Next Steps

Launch demos

See Telerik UI for Blazor in action and check out how much it can do out-of-the-box.

Download free trial

Try Telerik UI for Blazor with dedicated technical support.