Blueprint

A React UI toolkit for the web

Docs GitHub

Build complex, data-dense interfaces with ease

Blueprint is a collection of React UI components that cover the majority of the common interface elements, patterns, and interactions on the web. Using Blueprint ensures that you’ll end up with an elegant and easy-to-use UI, freeing you to focus on building your product—not the atomic pieces that comprise it.
Go to documentation View GitHub repository
Productivity

Productivity

Enjoy a set of high quality generic components that you can use out of the box.
Composition

Composition

React components and TypeScript interfaces are easy to compose together.
Custom styles

Custom styles

Styles are built with Sass and designed to be flexible and customizable.
Design system

Design system

Universal design concepts and modifiers are applicable across components.
Types and tests

Types and tests

TypeScript makes developing with Blueprint faster and more predictable with static types.
Accessibility

Accessibility

Color combinations and keyboard interactions have been carefully crafted to be accessible.

Let’s get started

1

Install via NPM

> npm install --save @blueprintjs/core
2

Import and use the components

import {
    Button,
    Menu,
    MenuItem,
    MenuDivider,
    Popover,
    Position
} from "@blueprintjs/core";

const menu = (
    <Menu>
        <MenuItem text="New" />
        <MenuItem text="Open" />
        <MenuItem text="Save" />
        <MenuDivider />
        <MenuItem text="Settings..." />
    </Menu>
);

<Popover content={menu} position={Position.BOTTOM_RIGHT}>
    <Button text="Actions" />
</Popover>
Palantir

Blueprint is an open source project
developed at Palantir.

We’re hiring designers and engineers!
View openings