diff --git a/Diagram/Server/Pages/Export/Export.razor b/Diagram/Server/Pages/Export/Export.razor
index d77c2985..5f2e8712 100644
--- a/Diagram/Server/Pages/Export/Export.razor
+++ b/Diagram/Server/Pages/Export/Export.razor
@@ -3,24 +3,24 @@
 @using Syncfusion.Blazor.Buttons
 
 <SfButton Content="ExportBase64" OnClick="@ExportBase64" />
-<SfButton Content="ExportPng" OnClick="@ExportPng" />
-<SfDiagramComponent Height="600px" @ref="@diagram" />
+<SfButton Content="ExportPng" OnClick="@ExportPngAsync" />
+<SfDiagramComponent Height="600px" @ref="@_diagram" />
 
 @code
 {
-    private SfDiagramComponent diagram;
+    private SfDiagramComponent _diagram;
 
     //To export the diagram as base64 string.
-    private async Task ExportBase64()
+    private async Task ExportBase64Async()
     {
-        DiagramExportSettings export = new DiagramExportSettings();
-        string[] base64 = await diagram.ExportAsync(DiagramExportFormat.PNG, export);
+        DiagramExportSettings _export = new DiagramExportSettings();
+        string[] _base64 = await _diagram.ExportAsync(DiagramExportFormat.PNG, _export);
     }
 
     //To export the diagram as png.
-    private async Task ExportPng()
+    private async Task ExportPngAsync()
     {
-        DiagramExportSettings export = new DiagramExportSettings();
-        await diagram.ExportAsync("diagram", DiagramExportFormat.PNG, export);
+        DiagramExportSettings _export = new DiagramExportSettings();
+        await _diagram.ExportAsync("diagram", DiagramExportFormat.PNG, _export);
     }
 }
\ No newline at end of file
diff --git a/Diagram/Server/Pages/Export/ExportClipBounds.razor b/Diagram/Server/Pages/Export/ExportClipBounds.razor
index 336f3153..ade64de6 100644
--- a/Diagram/Server/Pages/Export/ExportClipBounds.razor
+++ b/Diagram/Server/Pages/Export/ExportClipBounds.razor
@@ -2,24 +2,24 @@
 @using Syncfusion.Blazor.Diagram
 @using Syncfusion.Blazor.Buttons
 
-<SfButton Content="Export" OnClick="@Export" />
-<SfDiagramComponent Height="600px" @ref="@diagram">
+<SfButton Content="Export" OnClick="@ExportAsync" />
+<SfDiagramComponent Height="600px" @ref="@_diagram">
     <PageSettings Height="1000" Width="800"></PageSettings>
 </SfDiagramComponent>
 
 @code
 {
-    private SfDiagramComponent diagram;
+    private SfDiagramComponent _diagram;
 
-    private async Task Export()
+    private async Task ExportAsync()
     {
-        DiagramExportSettings export = new DiagramExportSettings();
-        export.Region = DiagramPrintExportRegion.PageSettings;
-        export.PageWidth = 816;
-        export.PageHeight = 1054;
-        export.Margin = new DiagramThickness() { Left = 10, Top = 10, Right = 10, Bottom = 10 };
-        export.ClipBounds = new DiagramRect() { X = 0, Y = 0, Width = 500, Height = 500 };
+        DiagramExportSettings _export = new DiagramExportSettings();
+        _export.Region = DiagramPrintExportRegion.PageSettings;
+        _export.PageWidth = 816;
+        _export.PageHeight = 1054;
+        _export.Margin = new DiagramThickness() { Left = 10, Top = 10, Right = 10, Bottom = 10 };
+        _export.ClipBounds = new DiagramRect() { X = 0, Y = 0, Width = 500, Height = 500 };
         //To export the diagram
-        await diagram.ExportAsync("diagram",DiagramExportFormat.PNG, export);
+        await _diagram.ExportAsync("diagram",DiagramExportFormat.PNG, _export);
     }
 }
\ No newline at end of file
diff --git a/Diagram/Server/Pages/Export/ExportMargin.razor b/Diagram/Server/Pages/Export/ExportMargin.razor
index 79e694d8..6178fe48 100644
--- a/Diagram/Server/Pages/Export/ExportMargin.razor
+++ b/Diagram/Server/Pages/Export/ExportMargin.razor
@@ -2,24 +2,24 @@
 @using Syncfusion.Blazor.Diagram
 @using Syncfusion.Blazor.Buttons
 
-<SfButton Content="Export" OnClick="@Export" />
-<SfDiagramComponent Height="600px" @ref="@diagram">
+<SfButton Content="Export" OnClick="@ExportAsync" />
+<SfDiagramComponent Height="600px" @ref="@_diagram">
     <PageSettings Height="1000" Width="800"></PageSettings>
 </SfDiagramComponent>
 
 @code
 {
     //Reference the diagram
-    private SfDiagramComponent diagram;
+    private SfDiagramComponent _diagram;
 
-    private async Task Export()
+    private async Task ExportAsync()
     {
-        DiagramExportSettings export = new DiagramExportSettings();
-        export.Region = DiagramPrintExportRegion.PageSettings;
-        export.PageWidth = 816;
-        export.PageHeight = 1054;
-        export.Margin = new DiagramThickness() { Left = 10, Top = 10, Right = 10, Bottom = 10 };
+        DiagramExportSettings _export = new DiagramExportSettings();
+        _export.Region = DiagramPrintExportRegion.PageSettings;
+        _export.PageWidth = 816;
+        _export.PageHeight = 1054;
+        _export.Margin = new DiagramThickness() { Left = 10, Top = 10, Right = 10, Bottom = 10 };
         //To export the diagram
-        await diagram.ExportAsync("diagram", DiagramExportFormat.PNG, export);
+        await _diagram.ExportAsync("diagram", DiagramExportFormat.PNG, _export);
     }
 }
\ No newline at end of file
diff --git a/Diagram/Server/Pages/Export/ExportOption.razor b/Diagram/Server/Pages/Export/ExportOption.razor
index 32b1ceb0..e6816fa9 100644
--- a/Diagram/Server/Pages/Export/ExportOption.razor
+++ b/Diagram/Server/Pages/Export/ExportOption.razor
@@ -2,19 +2,19 @@
 @using Syncfusion.Blazor.Diagram
 @using Syncfusion.Blazor.Buttons
 
-<SfButton Content="Export" OnClick="@Export" />
-<SfDiagramComponent Height="600px" @ref="@diagram">
+<SfButton Content="Export" OnClick="@ExportAsync" />
+<SfDiagramComponent Height="600px" @ref="@_diagram">
 </SfDiagramComponent>
 
 @code
 {
     //Reference the diagram
-    private SfDiagramComponent diagram;
+    private SfDiagramComponent _diagram;
 
-    private async Task Export()
+    private async Task ExportAsync()
     {
-        DiagramExportSettings export = new DiagramExportSettings();
+        DiagramExportSettings _export = new DiagramExportSettings();
         //To export the diagram
-        await diagram.ExportAsync("Diagram", DiagramExportFormat.SVG, export);
+        await _diagram.ExportAsync("Diagram", DiagramExportFormat.SVG, _export);
     }
 }
\ No newline at end of file
diff --git a/Diagram/Server/Pages/Export/ExportOrientation.razor b/Diagram/Server/Pages/Export/ExportOrientation.razor
index 15f0ebf3..6983d7b8 100644
--- a/Diagram/Server/Pages/Export/ExportOrientation.razor
+++ b/Diagram/Server/Pages/Export/ExportOrientation.razor
@@ -2,26 +2,26 @@
 @using Syncfusion.Blazor.Diagram
 @using Syncfusion.Blazor.Buttons
 
-<SfButton Content="Export" OnClick="@Export" />
-<SfDiagramComponent Height="600px" @ref="@diagram" />
+<SfButton Content="Export" OnClick="@ExportAsync" />
+<SfDiagramComponent Height="600px" @ref="@_diagram" />
 
 @code
 {
     //Reference the diagram
-    private SfDiagramComponent diagram;
+    private SfDiagramComponent _diagram;
 
-    private async Task Export()
+    private async Task ExportAsync()
     {
-        DiagramExportSettings export = new DiagramExportSettings();
-        export.Region = DiagramPrintExportRegion.PageSettings;
-        export.PageWidth = 816;
-        export.PageHeight = 1054;
+        DiagramExportSettings _export = new DiagramExportSettings();
+        _export.Region = DiagramPrintExportRegion.PageSettings;
+        _export.PageWidth = 816;
+        _export.PageHeight = 1054;
         //To export the diagram in single page.
-        export.FitToPage = true;
-        export.Orientation = PageOrientation.Landscape;
-        export.Margin = new DiagramThickness() { Left = 10, Top = 10, Right = 10, Bottom = 10 };
-        export.ClipBounds = new DiagramRect() { X = 0, Y = 0, Width = 500, Height = 500 };
+        _export.FitToPage = true;
+        _export.Orientation = PageOrientation.Landscape;
+        _export.Margin = new DiagramThickness() { Left = 10, Top = 10, Right = 10, Bottom = 10 };
+        _export.ClipBounds = new DiagramRect() { X = 0, Y = 0, Width = 500, Height = 500 };
         //To export the diagram
-        await diagram.ExportAsync("diagram", DiagramExportFormat.PNG, export);
+        await _diagram.ExportAsync("diagram", DiagramExportFormat.PNG, _export);
     }
 }
\ No newline at end of file
diff --git a/Diagram/Server/Pages/Export/ExportRegion.razor b/Diagram/Server/Pages/Export/ExportRegion.razor
index a57f3513..a4b00349 100644
--- a/Diagram/Server/Pages/Export/ExportRegion.razor
+++ b/Diagram/Server/Pages/Export/ExportRegion.razor
@@ -3,24 +3,24 @@
 @using Syncfusion.Blazor.Diagram
 @using Syncfusion.Blazor.Buttons
 
-<SfButton Content="Export" OnClick="@Export" />
-<SfDiagramComponent Height="600px" @ref="@diagram">
+<SfButton Content="Export" OnClick="@ExportAsync" />
+<SfDiagramComponent Height="600px" @ref="@_diagram">
     <PageSettings Height="1000" Width="800"></PageSettings>
 </SfDiagramComponent>
 
 @code
 {
     //Reference the diagram
-    private SfDiagramComponent diagram;
+    private SfDiagramComponent _diagram;
 
-    private async Task Export()
+    private async Task ExportAsync()
     {
-        DiagramExportSettings export = new DiagramExportSettings();
-        export.Region = DiagramPrintExportRegion.PageSettings;
-        export.PageWidth = 816;
-        export.PageHeight = 1054;
-        export.Margin = new DiagramThickness() { Left = 10, Top = 10, Right = 10, Bottom = 10 };
+        DiagramExportSettings _export = new DiagramExportSettings();
+        _export.Region = DiagramPrintExportRegion.PageSettings;
+        _export.PageWidth = 816;
+        _export.PageHeight = 1054;
+        _export.Margin = new DiagramThickness() { Left = 10, Top = 10, Right = 10, Bottom = 10 };
         //To export the diagram
-        await diagram.ExportAsync("Diagram", DiagramExportFormat.PNG, export);
+        await _diagram.ExportAsync("Diagram", DiagramExportFormat.PNG, _export);
     }
 }
\ No newline at end of file
diff --git a/Diagram/Server/Pages/Export/ExportToPDF.razor b/Diagram/Server/Pages/Export/ExportToPDF.razor
new file mode 100644
index 00000000..b5eabc29
--- /dev/null
+++ b/Diagram/Server/Pages/Export/ExportToPDF.razor
@@ -0,0 +1,105 @@
+@page "/Export"
+
+@using Syncfusion.PdfExport;
+@using Syncfusion.Blazor.Diagram
+@using Syncfusion.Blazor.Buttons
+@inject IJSRuntime JS;
+
+<SfButton Content="ExportPDF" OnClick="@ExportPDFAsync" />
+<SfButton Content="ExportPng" OnClick="@ExportPngAsync" />
+<SfDiagramComponent Height="600px" @ref="@_diagram" />
+
+@code
+{
+    //Reference the diagram
+    SfDiagramComponent _diagram;
+
+    private async void ExportPDFAsync()
+    {
+        DiagramExportSettings _print = new DiagramExportSettings();
+        _print.Region = DiagramPrintExportRegion.PageSettings;
+        _print.PageWidth = 500;
+        _print.PageHeight = 800;
+        _print.Orientation = PageOrientation.Portrait;
+        _print.FitToPage = true;
+        _print.Margin = new DiagramThickness() { Left = 30, Top = 20, Right = 10, Bottom = 10 };
+        _print.ClipBounds = new DiagramRect() { X = 200, Y = 200, Width = 200, Height = 200 };
+        //To export the diagram into base64
+        var _images = await _diagram.ExportAsync(DiagramExportFormat.PNG, _print);
+        var _pdforientation = PageOrientation.Portrait == PageOrientation.Landscape ? PdfPageOrientation.Landscape : PdfPageOrientation.Portrait;
+        await ExportToPdfAsync("diagram", _pdforientation, true, _images);        
+    }
+    //
+    private async Task<string> ExportToPdfAsync(string fileName, PdfPageOrientation orientation, bool allowDownload, string[] images)
+    {
+        PdfDocument _document = new PdfDocument();
+        _document.PageSettings.Orientation = orientation;
+        _document.PageSettings.Margins = new PdfMargins() { Left = 0, Right = 0, Top = 0, Bottom = 0 };
+        string _base64String;
+        var _dict = images;
+        for (int i = 0; i < _dict.Count(); i++)
+        {
+            _base64String = _dict[i];
+            using (MemoryStream _initialStream = new MemoryStream(Convert.FromBase64String(_base64String.Split("base64,")[1])))
+            {
+                Stream _stream = _initialStream as Stream;
+                PdfPage _page = _document.Pages.Add();
+                PdfGraphics _graphics = _page.Graphics;
+                #pragma warning disable CA2000
+                PdfBitmap _image = new PdfBitmap(_stream);
+                #pragma warning restore CA2000
+                _graphics.DrawImage(_image, 0, 0);
+            }
+        }
+        using (MemoryStream _memoryStream = new MemoryStream())
+        {
+            _document.Save(_memoryStream);
+            _memoryStream.Position = 0;
+            _base64String = Convert.ToBase64String(_memoryStream.ToArray());
+            if (allowDownload)
+            {
+                await JSRuntimeExtensions.InvokeAsync<string>(JS, "downloadPdf", new object[] { _base64String, fileName });
+                _base64String = string.Empty;
+            }
+            else
+            {
+                _base64String = "data:application/pdf;base64," + _base64String;
+            }
+            _document.Dispose();
+        }
+        return _base64String;
+    }
+}
+<script>
+// Javascript methods to download file
+function downloadPdf(base64String, fileName) {
+    var _sliceSize = 512;
+    var _byteCharacters = atob(base64String);
+    var _byteArrays = [];
+    for (var offset = 0; offset < _byteCharacters.length; offset += _sliceSize)
+    {
+        var _slice = _byteCharacters.slice(offset, offset + _sliceSize);
+        var _byteNumbers = new Array(slice.length);
+        for (var i = 0; i < _slice.length; i++)
+        {
+            _byteNumbers[i] = _slice.charCodeAt(i);
+        }
+        var _byteArray = new Uint8Array(_byteNumbers);
+        _byteArrays.push(_byteArray);
+    }
+    var _blob = new Blob(_byteArrays,
+        {
+            type: 'application/pdf'
+        }
+    );
+    var _blobUrl = window.URL.createObjectURL(_blob);
+    this.triggerDownload("PDF", fileName, _blobUrl);
+}
+triggerDownload: function triggerDownload(type, fileName, url)
+{
+    var _anchorElement = document.createElement('a');
+    _anchorElement.download = fileName + '.' + type.toLocaleLowerCase();
+    _anchorElement.href = url;
+    _anchorElement.click();
+}
+</script>
\ No newline at end of file
diff --git a/Diagram/Server/Pages/Export/ExportWithPage.razor b/Diagram/Server/Pages/Export/ExportWithPage.razor
index 4b95f9a5..bcbab2b3 100644
--- a/Diagram/Server/Pages/Export/ExportWithPage.razor
+++ b/Diagram/Server/Pages/Export/ExportWithPage.razor
@@ -3,27 +3,27 @@
 @using Syncfusion.Blazor.Diagram
 @using Syncfusion.Blazor.Buttons
 
-<SfButton Content="Export" OnClick="@Export" />
-<SfDiagramComponent Height="600px" @ref="@diagram">
+<SfButton Content="Export" OnClick="@ExportAsync" />
+<SfDiagramComponent Height="600px" @ref="@_diagram">
     <PageSettings Height="1000" Width="800"></PageSettings>
 </SfDiagramComponent>
 
 @code
 {
     //Reference the diagram.
-    private SfDiagramComponent diagram;
+    private SfDiagramComponent _diagram;
 
-    private async Task Export()
+    private async Task ExportAsync()
     {
-        DiagramExportSettings export = new DiagramExportSettings();
-        export.Region = DiagramPrintExportRegion.PageSettings;
-        export.PageWidth = 816;
-        export.PageHeight = 1054;
+        DiagramExportSettings _export = new DiagramExportSettings();
+        _export.Region = DiagramPrintExportRegion.PageSettings;
+        _export.PageWidth = 816;
+        _export.PageHeight = 1054;
         //To export the diagram in single page.
-        export.FitToPage = true;
-        export.Margin = new DiagramThickness() { Left = 10, Top = 10, Right = 10, Bottom = 10 };
-        export.ClipBounds = new DiagramRect() { X = 0, Y = 0, Width = 500, Height = 500 };
+        _export.FitToPage = true;
+        _export.Margin = new DiagramThickness() { Left = 10, Top = 10, Right = 10, Bottom = 10 };
+        _export.ClipBounds = new DiagramRect() { X = 0, Y = 0, Width = 500, Height = 500 };
         //To export the diagram
-        await diagram.ExportAsync("Diagram", DiagramExportFormat.PNG, export);
+        await _diagram.ExportAsync("Diagram", DiagramExportFormat.PNG, _export);
     }
 }
\ No newline at end of file
diff --git a/Diagram/Server/Pages/Export/ExportWithPageSize.razor b/Diagram/Server/Pages/Export/ExportWithPageSize.razor
index bb7d8a97..3e6302e1 100644
--- a/Diagram/Server/Pages/Export/ExportWithPageSize.razor
+++ b/Diagram/Server/Pages/Export/ExportWithPageSize.razor
@@ -3,20 +3,20 @@
 @using Syncfusion.Blazor.Diagram
 @using Syncfusion.Blazor.Buttons
 
-<SfButton Content="Export" OnClick="@Export" />
-<SfDiagramComponent Height="600px" @ref="@diagram" />
+<SfButton Content="Export" OnClick="@ExportAsync" />
+<SfDiagramComponent Height="600px" @ref="@_diagram" />
 
 @code 
 {
     //Reference the diagram
-    private SfDiagramComponent diagram;
+    private SfDiagramComponent _diagram;
 
-    private async Task Export()
+    private async Task ExportAsync()
     {
-        DiagramExportSettings export = new DiagramExportSettings();
-        export.PageWidth = 816;
-        export.PageHeight = 1054;
+        DiagramExportSettings _export = new DiagramExportSettings();
+        _export.PageWidth = 816;
+        _export.PageHeight = 1054;
         //To export the diagram
-        await diagram.ExportAsync(DiagramExportFormat.SVG, export);
+        await _diagram.ExportAsync(DiagramExportFormat.SVG, _export);
     }
 }
\ No newline at end of file
diff --git a/Diagram/Wasm/Pages/Export/Export.razor b/Diagram/Wasm/Pages/Export/Export.razor
index d77c2985..5f2e8712 100644
--- a/Diagram/Wasm/Pages/Export/Export.razor
+++ b/Diagram/Wasm/Pages/Export/Export.razor
@@ -3,24 +3,24 @@
 @using Syncfusion.Blazor.Buttons
 
 <SfButton Content="ExportBase64" OnClick="@ExportBase64" />
-<SfButton Content="ExportPng" OnClick="@ExportPng" />
-<SfDiagramComponent Height="600px" @ref="@diagram" />
+<SfButton Content="ExportPng" OnClick="@ExportPngAsync" />
+<SfDiagramComponent Height="600px" @ref="@_diagram" />
 
 @code
 {
-    private SfDiagramComponent diagram;
+    private SfDiagramComponent _diagram;
 
     //To export the diagram as base64 string.
-    private async Task ExportBase64()
+    private async Task ExportBase64Async()
     {
-        DiagramExportSettings export = new DiagramExportSettings();
-        string[] base64 = await diagram.ExportAsync(DiagramExportFormat.PNG, export);
+        DiagramExportSettings _export = new DiagramExportSettings();
+        string[] _base64 = await _diagram.ExportAsync(DiagramExportFormat.PNG, _export);
     }
 
     //To export the diagram as png.
-    private async Task ExportPng()
+    private async Task ExportPngAsync()
     {
-        DiagramExportSettings export = new DiagramExportSettings();
-        await diagram.ExportAsync("diagram", DiagramExportFormat.PNG, export);
+        DiagramExportSettings _export = new DiagramExportSettings();
+        await _diagram.ExportAsync("diagram", DiagramExportFormat.PNG, _export);
     }
 }
\ No newline at end of file
diff --git a/Diagram/Wasm/Pages/Export/ExportClipBounds.razor b/Diagram/Wasm/Pages/Export/ExportClipBounds.razor
index 336f3153..ade64de6 100644
--- a/Diagram/Wasm/Pages/Export/ExportClipBounds.razor
+++ b/Diagram/Wasm/Pages/Export/ExportClipBounds.razor
@@ -2,24 +2,24 @@
 @using Syncfusion.Blazor.Diagram
 @using Syncfusion.Blazor.Buttons
 
-<SfButton Content="Export" OnClick="@Export" />
-<SfDiagramComponent Height="600px" @ref="@diagram">
+<SfButton Content="Export" OnClick="@ExportAsync" />
+<SfDiagramComponent Height="600px" @ref="@_diagram">
     <PageSettings Height="1000" Width="800"></PageSettings>
 </SfDiagramComponent>
 
 @code
 {
-    private SfDiagramComponent diagram;
+    private SfDiagramComponent _diagram;
 
-    private async Task Export()
+    private async Task ExportAsync()
     {
-        DiagramExportSettings export = new DiagramExportSettings();
-        export.Region = DiagramPrintExportRegion.PageSettings;
-        export.PageWidth = 816;
-        export.PageHeight = 1054;
-        export.Margin = new DiagramThickness() { Left = 10, Top = 10, Right = 10, Bottom = 10 };
-        export.ClipBounds = new DiagramRect() { X = 0, Y = 0, Width = 500, Height = 500 };
+        DiagramExportSettings _export = new DiagramExportSettings();
+        _export.Region = DiagramPrintExportRegion.PageSettings;
+        _export.PageWidth = 816;
+        _export.PageHeight = 1054;
+        _export.Margin = new DiagramThickness() { Left = 10, Top = 10, Right = 10, Bottom = 10 };
+        _export.ClipBounds = new DiagramRect() { X = 0, Y = 0, Width = 500, Height = 500 };
         //To export the diagram
-        await diagram.ExportAsync("diagram",DiagramExportFormat.PNG, export);
+        await _diagram.ExportAsync("diagram",DiagramExportFormat.PNG, _export);
     }
 }
\ No newline at end of file
diff --git a/Diagram/Wasm/Pages/Export/ExportMargin.razor b/Diagram/Wasm/Pages/Export/ExportMargin.razor
index 79e694d8..6178fe48 100644
--- a/Diagram/Wasm/Pages/Export/ExportMargin.razor
+++ b/Diagram/Wasm/Pages/Export/ExportMargin.razor
@@ -2,24 +2,24 @@
 @using Syncfusion.Blazor.Diagram
 @using Syncfusion.Blazor.Buttons
 
-<SfButton Content="Export" OnClick="@Export" />
-<SfDiagramComponent Height="600px" @ref="@diagram">
+<SfButton Content="Export" OnClick="@ExportAsync" />
+<SfDiagramComponent Height="600px" @ref="@_diagram">
     <PageSettings Height="1000" Width="800"></PageSettings>
 </SfDiagramComponent>
 
 @code
 {
     //Reference the diagram
-    private SfDiagramComponent diagram;
+    private SfDiagramComponent _diagram;
 
-    private async Task Export()
+    private async Task ExportAsync()
     {
-        DiagramExportSettings export = new DiagramExportSettings();
-        export.Region = DiagramPrintExportRegion.PageSettings;
-        export.PageWidth = 816;
-        export.PageHeight = 1054;
-        export.Margin = new DiagramThickness() { Left = 10, Top = 10, Right = 10, Bottom = 10 };
+        DiagramExportSettings _export = new DiagramExportSettings();
+        _export.Region = DiagramPrintExportRegion.PageSettings;
+        _export.PageWidth = 816;
+        _export.PageHeight = 1054;
+        _export.Margin = new DiagramThickness() { Left = 10, Top = 10, Right = 10, Bottom = 10 };
         //To export the diagram
-        await diagram.ExportAsync("diagram", DiagramExportFormat.PNG, export);
+        await _diagram.ExportAsync("diagram", DiagramExportFormat.PNG, _export);
     }
 }
\ No newline at end of file
diff --git a/Diagram/Wasm/Pages/Export/ExportOption.razor b/Diagram/Wasm/Pages/Export/ExportOption.razor
index 32b1ceb0..e6816fa9 100644
--- a/Diagram/Wasm/Pages/Export/ExportOption.razor
+++ b/Diagram/Wasm/Pages/Export/ExportOption.razor
@@ -2,19 +2,19 @@
 @using Syncfusion.Blazor.Diagram
 @using Syncfusion.Blazor.Buttons
 
-<SfButton Content="Export" OnClick="@Export" />
-<SfDiagramComponent Height="600px" @ref="@diagram">
+<SfButton Content="Export" OnClick="@ExportAsync" />
+<SfDiagramComponent Height="600px" @ref="@_diagram">
 </SfDiagramComponent>
 
 @code
 {
     //Reference the diagram
-    private SfDiagramComponent diagram;
+    private SfDiagramComponent _diagram;
 
-    private async Task Export()
+    private async Task ExportAsync()
     {
-        DiagramExportSettings export = new DiagramExportSettings();
+        DiagramExportSettings _export = new DiagramExportSettings();
         //To export the diagram
-        await diagram.ExportAsync("Diagram", DiagramExportFormat.SVG, export);
+        await _diagram.ExportAsync("Diagram", DiagramExportFormat.SVG, _export);
     }
 }
\ No newline at end of file
diff --git a/Diagram/Wasm/Pages/Export/ExportOrientation.razor b/Diagram/Wasm/Pages/Export/ExportOrientation.razor
index 15f0ebf3..6983d7b8 100644
--- a/Diagram/Wasm/Pages/Export/ExportOrientation.razor
+++ b/Diagram/Wasm/Pages/Export/ExportOrientation.razor
@@ -2,26 +2,26 @@
 @using Syncfusion.Blazor.Diagram
 @using Syncfusion.Blazor.Buttons
 
-<SfButton Content="Export" OnClick="@Export" />
-<SfDiagramComponent Height="600px" @ref="@diagram" />
+<SfButton Content="Export" OnClick="@ExportAsync" />
+<SfDiagramComponent Height="600px" @ref="@_diagram" />
 
 @code
 {
     //Reference the diagram
-    private SfDiagramComponent diagram;
+    private SfDiagramComponent _diagram;
 
-    private async Task Export()
+    private async Task ExportAsync()
     {
-        DiagramExportSettings export = new DiagramExportSettings();
-        export.Region = DiagramPrintExportRegion.PageSettings;
-        export.PageWidth = 816;
-        export.PageHeight = 1054;
+        DiagramExportSettings _export = new DiagramExportSettings();
+        _export.Region = DiagramPrintExportRegion.PageSettings;
+        _export.PageWidth = 816;
+        _export.PageHeight = 1054;
         //To export the diagram in single page.
-        export.FitToPage = true;
-        export.Orientation = PageOrientation.Landscape;
-        export.Margin = new DiagramThickness() { Left = 10, Top = 10, Right = 10, Bottom = 10 };
-        export.ClipBounds = new DiagramRect() { X = 0, Y = 0, Width = 500, Height = 500 };
+        _export.FitToPage = true;
+        _export.Orientation = PageOrientation.Landscape;
+        _export.Margin = new DiagramThickness() { Left = 10, Top = 10, Right = 10, Bottom = 10 };
+        _export.ClipBounds = new DiagramRect() { X = 0, Y = 0, Width = 500, Height = 500 };
         //To export the diagram
-        await diagram.ExportAsync("diagram", DiagramExportFormat.PNG, export);
+        await _diagram.ExportAsync("diagram", DiagramExportFormat.PNG, _export);
     }
 }
\ No newline at end of file
diff --git a/Diagram/Wasm/Pages/Export/ExportRegion.razor b/Diagram/Wasm/Pages/Export/ExportRegion.razor
index a57f3513..a4b00349 100644
--- a/Diagram/Wasm/Pages/Export/ExportRegion.razor
+++ b/Diagram/Wasm/Pages/Export/ExportRegion.razor
@@ -3,24 +3,24 @@
 @using Syncfusion.Blazor.Diagram
 @using Syncfusion.Blazor.Buttons
 
-<SfButton Content="Export" OnClick="@Export" />
-<SfDiagramComponent Height="600px" @ref="@diagram">
+<SfButton Content="Export" OnClick="@ExportAsync" />
+<SfDiagramComponent Height="600px" @ref="@_diagram">
     <PageSettings Height="1000" Width="800"></PageSettings>
 </SfDiagramComponent>
 
 @code
 {
     //Reference the diagram
-    private SfDiagramComponent diagram;
+    private SfDiagramComponent _diagram;
 
-    private async Task Export()
+    private async Task ExportAsync()
     {
-        DiagramExportSettings export = new DiagramExportSettings();
-        export.Region = DiagramPrintExportRegion.PageSettings;
-        export.PageWidth = 816;
-        export.PageHeight = 1054;
-        export.Margin = new DiagramThickness() { Left = 10, Top = 10, Right = 10, Bottom = 10 };
+        DiagramExportSettings _export = new DiagramExportSettings();
+        _export.Region = DiagramPrintExportRegion.PageSettings;
+        _export.PageWidth = 816;
+        _export.PageHeight = 1054;
+        _export.Margin = new DiagramThickness() { Left = 10, Top = 10, Right = 10, Bottom = 10 };
         //To export the diagram
-        await diagram.ExportAsync("Diagram", DiagramExportFormat.PNG, export);
+        await _diagram.ExportAsync("Diagram", DiagramExportFormat.PNG, _export);
     }
 }
\ No newline at end of file
diff --git a/Diagram/Wasm/Pages/Export/ExportToPDF.razor b/Diagram/Wasm/Pages/Export/ExportToPDF.razor
new file mode 100644
index 00000000..b5eabc29
--- /dev/null
+++ b/Diagram/Wasm/Pages/Export/ExportToPDF.razor
@@ -0,0 +1,105 @@
+@page "/Export"
+
+@using Syncfusion.PdfExport;
+@using Syncfusion.Blazor.Diagram
+@using Syncfusion.Blazor.Buttons
+@inject IJSRuntime JS;
+
+<SfButton Content="ExportPDF" OnClick="@ExportPDFAsync" />
+<SfButton Content="ExportPng" OnClick="@ExportPngAsync" />
+<SfDiagramComponent Height="600px" @ref="@_diagram" />
+
+@code
+{
+    //Reference the diagram
+    SfDiagramComponent _diagram;
+
+    private async void ExportPDFAsync()
+    {
+        DiagramExportSettings _print = new DiagramExportSettings();
+        _print.Region = DiagramPrintExportRegion.PageSettings;
+        _print.PageWidth = 500;
+        _print.PageHeight = 800;
+        _print.Orientation = PageOrientation.Portrait;
+        _print.FitToPage = true;
+        _print.Margin = new DiagramThickness() { Left = 30, Top = 20, Right = 10, Bottom = 10 };
+        _print.ClipBounds = new DiagramRect() { X = 200, Y = 200, Width = 200, Height = 200 };
+        //To export the diagram into base64
+        var _images = await _diagram.ExportAsync(DiagramExportFormat.PNG, _print);
+        var _pdforientation = PageOrientation.Portrait == PageOrientation.Landscape ? PdfPageOrientation.Landscape : PdfPageOrientation.Portrait;
+        await ExportToPdfAsync("diagram", _pdforientation, true, _images);        
+    }
+    //
+    private async Task<string> ExportToPdfAsync(string fileName, PdfPageOrientation orientation, bool allowDownload, string[] images)
+    {
+        PdfDocument _document = new PdfDocument();
+        _document.PageSettings.Orientation = orientation;
+        _document.PageSettings.Margins = new PdfMargins() { Left = 0, Right = 0, Top = 0, Bottom = 0 };
+        string _base64String;
+        var _dict = images;
+        for (int i = 0; i < _dict.Count(); i++)
+        {
+            _base64String = _dict[i];
+            using (MemoryStream _initialStream = new MemoryStream(Convert.FromBase64String(_base64String.Split("base64,")[1])))
+            {
+                Stream _stream = _initialStream as Stream;
+                PdfPage _page = _document.Pages.Add();
+                PdfGraphics _graphics = _page.Graphics;
+                #pragma warning disable CA2000
+                PdfBitmap _image = new PdfBitmap(_stream);
+                #pragma warning restore CA2000
+                _graphics.DrawImage(_image, 0, 0);
+            }
+        }
+        using (MemoryStream _memoryStream = new MemoryStream())
+        {
+            _document.Save(_memoryStream);
+            _memoryStream.Position = 0;
+            _base64String = Convert.ToBase64String(_memoryStream.ToArray());
+            if (allowDownload)
+            {
+                await JSRuntimeExtensions.InvokeAsync<string>(JS, "downloadPdf", new object[] { _base64String, fileName });
+                _base64String = string.Empty;
+            }
+            else
+            {
+                _base64String = "data:application/pdf;base64," + _base64String;
+            }
+            _document.Dispose();
+        }
+        return _base64String;
+    }
+}
+<script>
+// Javascript methods to download file
+function downloadPdf(base64String, fileName) {
+    var _sliceSize = 512;
+    var _byteCharacters = atob(base64String);
+    var _byteArrays = [];
+    for (var offset = 0; offset < _byteCharacters.length; offset += _sliceSize)
+    {
+        var _slice = _byteCharacters.slice(offset, offset + _sliceSize);
+        var _byteNumbers = new Array(slice.length);
+        for (var i = 0; i < _slice.length; i++)
+        {
+            _byteNumbers[i] = _slice.charCodeAt(i);
+        }
+        var _byteArray = new Uint8Array(_byteNumbers);
+        _byteArrays.push(_byteArray);
+    }
+    var _blob = new Blob(_byteArrays,
+        {
+            type: 'application/pdf'
+        }
+    );
+    var _blobUrl = window.URL.createObjectURL(_blob);
+    this.triggerDownload("PDF", fileName, _blobUrl);
+}
+triggerDownload: function triggerDownload(type, fileName, url)
+{
+    var _anchorElement = document.createElement('a');
+    _anchorElement.download = fileName + '.' + type.toLocaleLowerCase();
+    _anchorElement.href = url;
+    _anchorElement.click();
+}
+</script>
\ No newline at end of file
diff --git a/Diagram/Wasm/Pages/Export/ExportWithPage.razor b/Diagram/Wasm/Pages/Export/ExportWithPage.razor
index 4b95f9a5..bcbab2b3 100644
--- a/Diagram/Wasm/Pages/Export/ExportWithPage.razor
+++ b/Diagram/Wasm/Pages/Export/ExportWithPage.razor
@@ -3,27 +3,27 @@
 @using Syncfusion.Blazor.Diagram
 @using Syncfusion.Blazor.Buttons
 
-<SfButton Content="Export" OnClick="@Export" />
-<SfDiagramComponent Height="600px" @ref="@diagram">
+<SfButton Content="Export" OnClick="@ExportAsync" />
+<SfDiagramComponent Height="600px" @ref="@_diagram">
     <PageSettings Height="1000" Width="800"></PageSettings>
 </SfDiagramComponent>
 
 @code
 {
     //Reference the diagram.
-    private SfDiagramComponent diagram;
+    private SfDiagramComponent _diagram;
 
-    private async Task Export()
+    private async Task ExportAsync()
     {
-        DiagramExportSettings export = new DiagramExportSettings();
-        export.Region = DiagramPrintExportRegion.PageSettings;
-        export.PageWidth = 816;
-        export.PageHeight = 1054;
+        DiagramExportSettings _export = new DiagramExportSettings();
+        _export.Region = DiagramPrintExportRegion.PageSettings;
+        _export.PageWidth = 816;
+        _export.PageHeight = 1054;
         //To export the diagram in single page.
-        export.FitToPage = true;
-        export.Margin = new DiagramThickness() { Left = 10, Top = 10, Right = 10, Bottom = 10 };
-        export.ClipBounds = new DiagramRect() { X = 0, Y = 0, Width = 500, Height = 500 };
+        _export.FitToPage = true;
+        _export.Margin = new DiagramThickness() { Left = 10, Top = 10, Right = 10, Bottom = 10 };
+        _export.ClipBounds = new DiagramRect() { X = 0, Y = 0, Width = 500, Height = 500 };
         //To export the diagram
-        await diagram.ExportAsync("Diagram", DiagramExportFormat.PNG, export);
+        await _diagram.ExportAsync("Diagram", DiagramExportFormat.PNG, _export);
     }
 }
\ No newline at end of file
diff --git a/Diagram/Wasm/Pages/Export/ExportWithPageSize.razor b/Diagram/Wasm/Pages/Export/ExportWithPageSize.razor
index bb7d8a97..3e6302e1 100644
--- a/Diagram/Wasm/Pages/Export/ExportWithPageSize.razor
+++ b/Diagram/Wasm/Pages/Export/ExportWithPageSize.razor
@@ -3,20 +3,20 @@
 @using Syncfusion.Blazor.Diagram
 @using Syncfusion.Blazor.Buttons
 
-<SfButton Content="Export" OnClick="@Export" />
-<SfDiagramComponent Height="600px" @ref="@diagram" />
+<SfButton Content="Export" OnClick="@ExportAsync" />
+<SfDiagramComponent Height="600px" @ref="@_diagram" />
 
 @code 
 {
     //Reference the diagram
-    private SfDiagramComponent diagram;
+    private SfDiagramComponent _diagram;
 
-    private async Task Export()
+    private async Task ExportAsync()
     {
-        DiagramExportSettings export = new DiagramExportSettings();
-        export.PageWidth = 816;
-        export.PageHeight = 1054;
+        DiagramExportSettings _export = new DiagramExportSettings();
+        _export.PageWidth = 816;
+        _export.PageHeight = 1054;
         //To export the diagram
-        await diagram.ExportAsync(DiagramExportFormat.SVG, export);
+        await _diagram.ExportAsync(DiagramExportFormat.SVG, _export);
     }
 }
\ No newline at end of file