diff --git a/BlazorBarcodeScanner.ZXing.JS/BarcodeReader.razor b/BlazorBarcodeScanner.ZXing.JS/BarcodeReader.razor
index d75540d..2fdefb4 100644
--- a/BlazorBarcodeScanner.ZXing.JS/BarcodeReader.razor
+++ b/BlazorBarcodeScanner.ZXing.JS/BarcodeReader.razor
@@ -45,10 +45,10 @@
     <div class="zxing-video-container">
         @if (FullWidthVideo)
         {
-            <video @ref="_video"></video>
+            <video style="@VideoElementStyle" @ref="_video"></video>
         } else
         {
-            <video @ref="_video" width="@VideoWidth" height="@VideoHeight"></video>
+            <video style="@VideoElementStyle" @ref="_video" width="@VideoWidth" height="@VideoHeight"></video>
         }
 
     </div>
diff --git a/BlazorBarcodeScanner.ZXing.JS/BarcodeReader.razor.cs b/BlazorBarcodeScanner.ZXing.JS/BarcodeReader.razor.cs
index 2ab1387..61dcd4c 100644
--- a/BlazorBarcodeScanner.ZXing.JS/BarcodeReader.razor.cs
+++ b/BlazorBarcodeScanner.ZXing.JS/BarcodeReader.razor.cs
@@ -2,6 +2,7 @@
 using Microsoft.JSInterop;
 using System;
 using System.Collections.Generic;
+using System.Diagnostics.CodeAnalysis;
 using System.Threading.Tasks;
 
 namespace BlazorBarcodeScanner.ZXing.JS
@@ -67,6 +68,13 @@ public partial class BarcodeReader : ComponentBase, IDisposable, IAsyncDisposabl
 
         [Parameter]
         public int? StreamWidth { get; set; } = null;
+        
+        [Parameter]
+
+#if NET8_0
+        [StringSyntax("css")]
+#endif
+        public string VideoElementStyle { get; set; }
 
         [Parameter]
         public EventCallback<BarcodeReceivedEventArgs> OnBarcodeReceived { get; set; }
@@ -230,7 +238,7 @@ private async Task StartDecodingSafe()
 
         public async Task<string> Capture()
         {
-            return await _backend.Capture(_canvas);
+            return await _backend.Capture(_canvas,_video);
         }
 
         public async Task<string> CaptureLastDecodedPicture()
diff --git a/BlazorBarcodeScanner.ZXing.JS/BarcodeReaderInterop.cs b/BlazorBarcodeScanner.ZXing.JS/BarcodeReaderInterop.cs
index a6cb6ea..ee4e4d3 100644
--- a/BlazorBarcodeScanner.ZXing.JS/BarcodeReaderInterop.cs
+++ b/BlazorBarcodeScanner.ZXing.JS/BarcodeReaderInterop.cs
@@ -85,9 +85,9 @@ public async Task ToggleTorch()
             await jSRuntime.InvokeVoidAsync("BlazorBarcodeScanner.toggleTorch");
         }
 
-        public async Task<string> Capture(ElementReference canvas)
+        public async Task<string> Capture(ElementReference canvas, ElementReference video)
         {
-            await jSRuntime.InvokeVoidAsync("BlazorBarcodeScanner.capture", "image/jpeg", canvas);
+            await jSRuntime.InvokeVoidAsync("BlazorBarcodeScanner.capture", "image/jpeg", canvas,video);
             return await PictureGet("capture");
         }
 
diff --git a/BlazorBarcodeScanner.ZXing.JS/BlazorBarcodeScanner.ZXing.JS.csproj b/BlazorBarcodeScanner.ZXing.JS/BlazorBarcodeScanner.ZXing.JS.csproj
index 4233ba4..76078aa 100644
--- a/BlazorBarcodeScanner.ZXing.JS/BlazorBarcodeScanner.ZXing.JS.csproj
+++ b/BlazorBarcodeScanner.ZXing.JS/BlazorBarcodeScanner.ZXing.JS.csproj
@@ -2,7 +2,7 @@
 
   <PropertyGroup>
 	<TargetFrameworks>net8.0;net7.0;net6.0</TargetFrameworks>
-    <Version>1.0.4</Version>
+    <Version>1.0.5</Version>
     <Authors>Sabit Igde, Ueli Niederer</Authors>
 	<Company />
 	<Description>Barcode Scanner component for Blazor using zxing-js Interop</Description>
diff --git a/BlazorBarcodeScanner.ZXing.JS/wwwroot/BlazorBarcodeScanner.js b/BlazorBarcodeScanner.ZXing.JS/wwwroot/BlazorBarcodeScanner.js
index 3480cee..5d54935 100644
--- a/BlazorBarcodeScanner.ZXing.JS/wwwroot/BlazorBarcodeScanner.js
+++ b/BlazorBarcodeScanner.ZXing.JS/wwwroot/BlazorBarcodeScanner.js
@@ -182,26 +182,17 @@ window.BlazorBarcodeScanner = {
             mediaStreamSetTorch(track, torchStatus);
         }
     },
-    capture: async function (type, canvas) {
+    capture: async function (type, canvas,video) {
         this.lastPicture = "";
 
         if (!this.codeReader.stream) {
             return "";
         }
 
-        let capture = new ImageCapture(this.codeReader.stream.getVideoTracks()[0]);
-
-        await capture.grabFrame()
-            .then(bitmap => {
-                let context = canvas.getContext('2d');
-
-                canvas.width = bitmap.width;
-                canvas.height = bitmap.height;
-
-                context.drawImage(bitmap, 0, 0, bitmap.width, bitmap.height);
-
-                this.lastPicture = canvas.toDataURL(type);
-            });
+        canvas.width = video.videoWidth;
+        canvas.height = video.videoHeight;
+        canvas.getContext('2d').drawImage(video, 0, 0);
+        this.lastPicture = canvas.toDataURL('image/png');
     },
     pictureGetBase64Unmarshalled: function (source) {
         let source_str = BINDING.conv_string(source);
diff --git a/BlazorBarcodeScanner.Zxing.Cpp/BarcodeReader.razor b/BlazorBarcodeScanner.Zxing.Cpp/BarcodeReader.razor
index ca15081..4f4ec9d 100644
--- a/BlazorBarcodeScanner.Zxing.Cpp/BarcodeReader.razor
+++ b/BlazorBarcodeScanner.Zxing.Cpp/BarcodeReader.razor
@@ -46,10 +46,10 @@
         <canvas id="video-canvas" width="@VideoWidth" height="@VideoHeight"> 
         @if (FullWidthVideo)
         {
-            <video @ref="_video"></video>
+            <video style="@VideoElementStyle" @ref="_video"></video>
         } else
         {
-            <video @ref="_video" width="@VideoWidth" height="@VideoHeight"></video>
+            <video style="@VideoElementStyle" @ref="_video" width="@VideoWidth" height="@VideoHeight"></video>
         }
         </canvas>
 
diff --git a/BlazorBarcodeScanner.Zxing.Cpp/BarcodeReader.razor.cs b/BlazorBarcodeScanner.Zxing.Cpp/BarcodeReader.razor.cs
index 49578a3..80ffca4 100644
--- a/BlazorBarcodeScanner.Zxing.Cpp/BarcodeReader.razor.cs
+++ b/BlazorBarcodeScanner.Zxing.Cpp/BarcodeReader.razor.cs
@@ -1,4 +1,5 @@
-using Microsoft.AspNetCore.Components;
+using System.Diagnostics.CodeAnalysis;
+using Microsoft.AspNetCore.Components;
 using Microsoft.JSInterop;
 
 namespace BlazorBarcodeScanner.ZXing.Cpp
@@ -65,6 +66,12 @@ public partial class BarcodeReader : ComponentBase, IDisposable, IAsyncDisposabl
         [Parameter]
         public int? StreamWidth { get; set; } = null;
 
+        [Parameter]
+#if NET8_0
+        [StringSyntax("css")]
+#endif
+        public string VideoElementStyle { get; set; } ="";
+        
         [Parameter]
         public EventCallback<BarcodeReceivedEventArgs> OnBarcodeReceived { get; set; }
 
diff --git a/BlazorBarcodeScanner.Zxing.Cpp/wwwroot/BlazorBarcodeScanner.js b/BlazorBarcodeScanner.Zxing.Cpp/wwwroot/BlazorBarcodeScanner.js
index 020434c..be28cb5 100644
--- a/BlazorBarcodeScanner.Zxing.Cpp/wwwroot/BlazorBarcodeScanner.js
+++ b/BlazorBarcodeScanner.Zxing.Cpp/wwwroot/BlazorBarcodeScanner.js
@@ -327,26 +327,17 @@ window.BlazorBarcodeScanner = {
             mediaStreamSetTorch(track, torchStatus);
         }
     },
-    capture: async function (type, canvas) {
+    capture: async function (type, canvas,video) {
         this.lastPicture = "";
 
         if (!this.codeReader.stream) {
             return "";
         }
 
-        let capture = new ImageCapture(this.codeReader.stream.getVideoTracks()[0]);
-
-        await capture.grabFrame()
-            .then(bitmap => {
-                let context = canvas.getContext('2d');
-
-                canvas.width = bitmap.width;
-                canvas.height = bitmap.height;
-
-                context.drawImage(bitmap, 0, 0, bitmap.width, bitmap.height);
-
-                this.lastPicture = canvas.toDataURL(type);
-            });
+        canvas.width = video.videoWidth;
+        canvas.height = video.videoHeight;
+        canvas.getContext('2d').drawImage(video, 0, 0);
+        this.lastPicture = canvas.toDataURL('image/png');
     },
     pictureGetBase64Unmarshalled: function (source) {
         let source_str = BINDING.conv_string(source);
diff --git a/BlazorZXingJSApp/Client/Pages/Index.razor b/BlazorZXingJSApp/Client/Pages/Index.razor
index 9f401c1..854a05e 100644
--- a/BlazorZXingJSApp/Client/Pages/Index.razor
+++ b/BlazorZXingJSApp/Client/Pages/Index.razor
@@ -14,6 +14,7 @@
             VideoHeight="540"
             StreamWidth="@StreamWidth"
             StreamHeight="@StreamHeight"
+            VideoElementStyle="@VideoElementStyle"
             OnBarcodeReceived="LocalReceivedBarcodeText"
             OnErrorReceived="LocalReceivedError"/>
     </div>
@@ -33,6 +34,15 @@
             </div>
             <button @onclick="() => _reader.UpdateResolution()" class="btn btn-outline-primary">Update stream</button>
         </div>
+        <div>
+            <b>Video element styling</b>
+            <div>(updates on enter or on focus loss)</div>
+            <div>
+                <label>Style:
+                    <input style="width: 7em" @bind="VideoElementStyle"  />
+                </label>
+            </div>
+        </div>
         <div class="mt-1">
             <div><b>Custom Result</b></div>
                 <div class="alert alert-success" style="word-break: break-all;" role="alert">@(!string.IsNullOrWhiteSpace(LocalBarcodeText) ? @LocalBarcodeText : "Results will be here")</div>
diff --git a/BlazorZXingJSApp/Client/Pages/Index.razor.cs b/BlazorZXingJSApp/Client/Pages/Index.razor.cs
index 6c2dd60..6aaf2fa 100644
--- a/BlazorZXingJSApp/Client/Pages/Index.razor.cs
+++ b/BlazorZXingJSApp/Client/Pages/Index.razor.cs
@@ -16,6 +16,7 @@ public partial class Index
 
         private string _imgSrc = string.Empty;
         private string _lastError = string.Empty;
+        public string VideoElementStyle { get; set; } = "";
 
         protected override void OnAfterRender(bool firstRender)
         {