Blinc

A GPU-accelerated, cross-platform UI framework with a GPUI-inspired builder API, glassmorphism effects, spring physics animations, and native rendering on Desktop, Android, and iOS.

Features

• GPU-Accelerated Rendering - SDF-based primitives via wgpu with automatic batching
• Glassmorphism Effects - Apple-style vibrancy with backdrop blur and frosted glass
• GPUI-Style Builder API - Declarative, chainable element builders (div(), text(), svg(), image())
• Flexbox Layout - Powered by Taffy with 100+ Tailwind-style builder methods
• Spring Physics - Interruptible animations with RK4 integration (Framer Motion quality)
• Cross-Platform - Desktop (macOS, Windows, Linux), Android, iOS
• Fine-Grained Reactivity - Signal-based state without VDOM overhead
• State Machines - Harel statecharts for complex widget interactions
• Image Support - PNG, JPEG, GIF, WebP, BMP with cross-platform asset loading
• SVG Rendering - Vector graphics with fill/stroke support
• Text Rendering - HarfBuzz shaping, glyph atlas, proper anchoring

Quick Start

Installation

# Build from source
git clone https://github.com/project-blinc/Blinc
cd Blinc
cargo build --release

Team Bootstrap

# Install optional local tooling used by CI
rustup component add rustfmt clippy
cargo install cargo-nextest cargo-audit cargo-deny

Local P0 Check Parity

# Keep checks aligned with CI hardening commands
cargo fmt --all -- --check
cargo clippy --workspace --all-features -- -W clippy::all -A clippy::type_complexity -A dead_code
cargo check --workspace --all-features
cargo nextest run --workspace --all-features
cargo test --doc --workspace --all-features
cargo audit
cargo deny check

Hello World

use blinc_app::prelude::*;
use blinc_app::windowed::WindowedApp;

fn main() -> Result<()> {
    WindowedApp::run(WindowConfig::default(), |ctx| {
        div()
            .w(ctx.width).h(ctx.height)
            .bg(Color::rgb(0.1, 0.1, 0.15))
            .flex_col()
            .justify_center()
            .items_center()
            .child(
                text("Hello Blinc!")
                    .size(48.0)
                    .color(Color::WHITE)
            )
    })
}

Glassmorphism Example

div()
    .w(ctx.width).h(ctx.height)
    .bg(Color::rgb(0.2, 0.3, 0.5))
    .flex_col()
    .justify_center()
    .items_center()
    .child(
        // Glass card with backdrop blur
        div()
            .glass()
            .rounded(16.0)
            .p(24.0)
            .child(text("Frosted Glass").size(24.0).color(Color::WHITE))
            .child(text("With backdrop blur").size(14.0).color(Color::rgb(0.8, 0.8, 0.8)))
    )

Image Support

div()
    .w(400.0).h(300.0)
    .flex_col()
    .justify_center()
    .items_center()
    .child(
        image("assets/photo.png")
            .w(200.0)
            .h(150.0)
            .rounded(8.0)
    )

Layout with Flexbox

div()
    .w_full().h_full()
    .flex_col()
    .gap(16.0)
    .p(24.0)
    .child(
        // Header
        div().h(60.0).bg(Color::rgb(0.2, 0.2, 0.25)).rounded(8.0),
    )
    .child(
        // Content area
        div()
            .flex_1()
            .flex_row()
            .gap(16.0)
            .child(div().w(200.0).bg(Color::rgb(0.15, 0.15, 0.2)).rounded(8.0))  // Sidebar
            .child(div().flex_1().bg(Color::rgb(0.18, 0.18, 0.22)).rounded(8.0)), // Main
    )
    .child(
        // Footer
        div().h(40.0).bg(Color::rgb(0.2, 0.2, 0.25)).rounded(8.0),
    )

Architecture

┌─────────────────────────────────────────────────────────────────────┐
│                           blinc_app                                  │
│          High-level API: BlincApp, WindowedApp, RenderContext        │
├─────────────────────────────────────────────────────────────────────┤
│  blinc_layout         │  blinc_gpu           │  blinc_paint          │
│  Flexbox (Taffy)      │  SDF Rendering       │  Canvas API           │
│  Element Builders     │  Glass/Blur          │  Paths/Shapes         │
│  RenderTree           │  MSAA                │  Transforms           │
├─────────────────────────────────────────────────────────────────────┤
│  blinc_text           │  blinc_svg           │  blinc_image          │
│  Font Loading         │  SVG Parsing         │  Image Decoding       │
│  Text Shaping         │  Vector Rendering    │  Texture Management   │
│  Glyph Atlas          │  Fill/Stroke         │  Cross-platform Load  │
├─────────────────────────────────────────────────────────────────────┤
│  blinc_core           │  blinc_animation     │  blinc_platform       │
│  Signals/Reactivity   │  Springs (RK4)       │  Window/Event Traits  │
│  State Machines       │  Keyframes           │  Input Events         │
│  Brush/Color Types    │  Timelines           │  Asset Loading        │
├─────────────────────────────────────────────────────────────────────┤
│     blinc_platform_desktop    │  blinc_platform_android  │   _ios   │
│     winit + wgpu              │  NDK + Vulkan            │  UIKit   │
└─────────────────────────────────────────────────────────────────────┘

Crates

Core

| Crate | Description | | ----- | ----------- | | blinc_app | High-level app framework with windowed runner | | blinc_core | Reactive signals, state machines, brush types | | blinc_layout | Flexbox layout engine with GPUI-style builders | | blinc_gpu | GPU rendering: SDF shapes, glass effects, MSAA |

Rendering & Media

| Crate | Description | | ----- | ----------- | | blinc_paint | Canvas/paint API for custom drawing | | blinc_text | Text shaping, font loading, glyph atlas | | blinc_image | Image loading and cross-platform assets | | blinc_svg | SVG parsing and rendering |

Animation & Theming

| Crate | Description | | ----- | ----------- | | blinc_animation | Spring physics and keyframe animations | | blinc_theme | Design tokens, theming, light/dark mode |

Component Library

| Crate | Description | | ----- | ----------- | | blinc_cn | shadcn/ui-style component library (40+ components) | | blinc_icons | Lucide icon set integration |

Platform

| Crate | Description | | ----- | ----------- | | blinc_platform | Cross-platform traits and asset loading | | blinc_platform_desktop | Desktop backend (winit) | | blinc_platform_android | Android backend (NDK) | | blinc_platform_ios | iOS backend (UIKit/Metal) |

Tooling & Development

| Crate | Description | | ----- | ----------- | | blinc_cli | Command-line tooling | | blinc_macros | Procedural macros for components | | blinc_debugger | Visual debugger overlay | | blinc_recorder | Frame recording and debugging | | blinc_runtime | Embedding SDK for host applications | | blinc_test_suite | Visual regression testing framework |

Builder API Reference

Layout Methods

// Size
.w(100.0)  .h(100.0)  .size(100.0, 100.0)
.w_full()  .h_full()  .w_auto()  .h_auto()
.min_w()   .max_w()   .min_h()   .max_h()

// Flexbox
.flex_row()    .flex_col()    .flex_1()
.justify_start() .justify_center() .justify_end() .justify_between()
.items_start()   .items_center()   .items_end()   .items_stretch()
.gap(16.0)     .gap_x(8.0)      .gap_y(8.0)

// Spacing
.p(16.0)    .px(8.0)    .py(8.0)
.pt(4.0)    .pb(4.0)    .pl(4.0)    .pr(4.0)
.m(16.0)    .mx(8.0)    .my(8.0)

Styling Methods

// Background
.bg(Color::rgb(r, g, b))
.bg(Color::from_hex(0xRRGGBB))
.glass()

// Border & Corners
.rounded(8.0)
.border(1.0, Color::GRAY)

// Shadow
.shadow_sm()  .shadow_md()  .shadow_lg()  .shadow_xl()

// Opacity & Clipping
.opacity(0.8)
.clip()

Elements

div()                      // Container element
text("Hello")              // Text element
    .size(16.0)
    .color(Color::WHITE)

svg(svg_string)            // SVG element
    .w(24.0).h(24.0)

image("path/to/image.png") // Image element
    .w(200.0).h(150.0)
    .rounded(8.0)

Canvas API

Custom drawing with paths, shapes, and transforms:

use blinc_paint::prelude::*;

fn canvas_example() -> Canvas{
    canvas(move |ctx: &mut dyn DrawContext, bounds| {
        let bar_height = 20.0;
        let bar_y = (bounds.height - bar_height) / 2.0;
        let