loading
Part of bit platform

Browser APIs for Blazor,
without writing JavaScript

bit Butil wraps the entire browser platform - window, document, storage, crypto, media, sensors and much more - in strongly-typed C# classes you simply inject and call. It works in every interactive Blazor mode: WebAssembly, Server and Hybrid (MAUI).

Shell
dotnet add package Bit.Butil
Razor
@inject Bit.Butil.Clipboard clipboard
@inject Bit.Butil.Geolocation geolocation
@inject Bit.Butil.LocalStorage localStorage

<button @onclick="Share">Share my position</button>

@code {
    private async Task Share()
    {
        var pos = await geolocation.GetCurrentPosition();
        var here = $"{pos.Coords.Latitude}, {pos.Coords.Longitude}";

        await clipboard.WriteText(here);
        await localStorage.SetItem("last-share", here);
    }
}
136 Documented APIs
100% C# No JS to write
1 Script tag to add
.NET 8.0+ Framework

Typed, not stringly

Every API is a class with real parameters, real return types and XML documentation - so IntelliSense, the compiler and refactoring all work on your browser code the way they work on the rest of it.

Every render mode

The same call compiles and runs under WebAssembly, Server and Hybrid, and returns a safe default while a page is being prerendered instead of throwing. How that works.

Honest about the platform

A wrapper cannot add a feature the engine has not shipped. Every page says what its API needs, and the support matrix tests the browser you are reading this in.

Note:
Everything on this site is live Every page pairs the documentation with interactive samples running against the real browser APIs - what you click is what the library does.

The catalogue

136 browser APIs and 6 guides, every one of them with runnable samples. Press Ctrl K to jump straight to one.

Overview 6

Window & Browsing 10

Screen & Diagnostics 7

DOM & Interaction 23

Element Attributes, ARIA, classes, content, scrolling, fullscreen, pointer capture and events on any ElementReference. All enginesAnimation Run and control Web Animations on any element, straight from C#. All enginesCss Computed styles, CSS.supports, typed style maps, stylesheets you can edit, Houdini worklets, and highlights painted over text. Varies by engineDom Find and create elements Blazor did not render, walk the tree, and bridge back to ElementReference. All enginesShadowDom Attach a shadow root, style it in isolation, and read into an open one - your own, or any that was not closed. All enginesCanvas Draw a video frame or an image onto a canvas, then export it as a data URL or a byte[]. All enginesPictureInPicture Float a video in an always-on-top window outside the page. All enginesDocumentPictureInPicture Put arbitrary DOM - custom controls, a live chart - in an always-on-top window. Chromium onlyHTTPSViewTransition Let the browser animate between two states of the page. Varies by engineKeyboard App-wide keyboard shortcuts with modifier support. All enginesIntersectionObserver Observe element visibility inside the viewport or a scroll container. All enginesMutationObserver Observe DOM tree, attribute and character-data mutations. All enginesResizeObserver Observe element size changes with box-model detail. All enginesCloseWatcher One event for Escape, the Android back gesture and every other way a user asks to close something. Chromium onlyInvokerCommands The command / commandfor attributes: declarative wiring for dialogs and popovers. Varies by engineTextEditContext The EditContext API: text input and IME composition decoupled from the editing surface. Chromium onlyPointerTracker Coalesced and predicted pointer samples, for drawing and annotation surfaces. Varies by engineKeyboard lock & layout Capture keys while fullscreen, and show the right key name on any layout. Chromium desktopHTTPSVirtualKeyboard Show, hide and lay out around the on-screen keyboard. Chromium on AndroidCustomElements ElementInternals and CustomStateSet: component state exposed to CSS as :state(). All enginesSelection Read, move and edit the user's selection - highlight it, replace it, or restore a caret. All enginesInk Delegated ink trails: the compositor draws ahead of your rendering. Chromium onlyHandwritingRecognition Turn strokes into text with a model already on the device. Chromium onlyexperimental

Storage 9

Files & Data 12

Network & Workers 15

Async & Scheduling 3

PWA & Installation 4

Device & Hardware 21

Battery Battery level, charging state and related events. Chromium onlyHTTPSGeolocation Current position, watch positions and errors. All enginespermissionMediaDevices Enumerate cameras/microphones, capture the screen, and open streams. All enginespermissionGamepad Read game controllers - buttons, sticks and rumble. All enginesDeviceOrientation Tilt, acceleration and rotation from the device's own sensors. Varies by enginepermissionNfc Read and write NDEF messages on NFC tags. Chromium on AndroidexperimentalSensors The Generic Sensor API: accelerometer, gyroscope, magnetometer, orientation, gravity, linear acceleration and ambient light. Chromium onlypermissionBluetooth Pick a Bluetooth LE device and read, write or subscribe to its GATT characteristics. Chromium onlypermissionUsb Pick a USB device, claim an interface and run control, bulk or interrupt transfers. Chromium onlypermissionSerial Open a serial port with the device's line settings, then read and write bytes. Chromium onlypermissionHid Exchange input, output and feature reports with a human-interface device. Chromium onlypermissionMidi MIDI inputs and outputs: listen to a controller, send notes to a synth. Chromium onlypermissionComputePressure Shed work before the machine stutters, by watching CPU and thermal pressure. Chromium onlyexperimentalDevicePosture Whether a foldable device is currently flat or folded across its hinge. Chromium onlyexperimentalWakeLock Keep the screen awake while your app needs it. Varies by engineHTTPSIdleDetector Detect user and screen idle state changes. Chromium onlyexperimentalContactPicker Let users pick contacts to share with your app. Chromium on AndroidexperimentalEyeDropper Sample any pixel color on the screen. Chromium desktopexperimentalBarcodeDetector Find QR codes and barcodes in a camera frame or an image. Chromium onlyexperimentalFaceDetector Find where faces are in an image or a camera frame - never whose they are. Chromium onlyexperimentalTextDetector Read printed text out of an image or a camera frame. Chromium onlyexperimental

Identity & Permissions 7

Security & Privacy 3

Commerce 2

Media & Speech 15

Built-in AI 6

An unhandled error has occurred. Reload 🗙