SkiaSharp.Views.Blazor

SkiaSharp.Views.Blazor brings SkiaSharp to Blazor WebAssembly with ready-to-use Razor components. Draw with the same SkiaSharp API used by native .NET applications while the package handles the browser canvas, JavaScript interop, input events, and WebAssembly native assets.

What you get

• SKCanvasView for CPU-rendered, on-demand drawing to an HTML canvas.
• SKGLView for WebGL-backed rendering and continuous animation.
• Pointer, wheel, and touch input events.
• Density-aware sizing and explicit invalidation.
• Transitive WebAssembly native assets and build integration.

Get started

Install the package into a Blazor WebAssembly project:

dotnet add package SkiaSharp.Views.Blazor

Add the namespaces to _Imports.razor:

@using SkiaSharp
@using SkiaSharp.Views.Blazor

Add a canvas to a Razor component:

<SKCanvasView OnPaintSurface="OnPaintSurface"
              IgnorePixelScaling="true" />

@code {
    private void OnPaintSurface(SKPaintSurfaceEventArgs e)
    {
        var canvas = e.Surface.Canvas;
        canvas.Clear(SKColors.White);

        using var paint = new SKPaint
        {
            Color = SKColors.CornflowerBlue,
            IsAntialias = true,
        };

        canvas.DrawCircle(
            e.Info.Width / 2f,
            e.Info.Height / 2f,
            Math.Min(e.Info.Width, e.Info.Height) * 0.3f,
            paint);
    }
}

The package supplies its browser interop automatically. Use .NET 8 or later for a complete WebAssembly application with the supported native assets. For animated or GPU-heavy scenes, switch to SKGLView and enable its render loop.

See it running

• Live Blazor WebAssembly Gallery - interactive SkiaSharp examples with no installation
• Buildable Blazor WebAssembly sample
• SkiaFiddle - experiment with drawing code in your browser

Documentation and resources

• SkiaSharp documentation
• Blazor API reference on Microsoft Learn
• Core SkiaSharp API reference
• WebAssembly package guidance

Feedback and contributing

SkiaSharp is an open-source Microsoft project built with the .NET community. Use GitHub Discussions for questions, file bugs and feature requests in the issue tracker, and read the contributing guide to get involved.

This package is released under the MIT license.