Base is a design system comprised of modern, responsive, living components. Base Web is the React implementation of Base.
On npm, you can find Base Web as baseui.
Add baseui and its peer dependencies to your project:
# using pnpm
pnpm add baseui@next styletron-react styletron-engine-monolithic
# using npm
npm install baseui@next styletron-react styletron-engine-monolithicimport { Client as Styletron } from "styletron-engine-monolithic";
import { Provider as StyletronProvider } from "styletron-react";
import { LightTheme, BaseProvider, styled } from "baseui";
import { StatefulInput } from "baseui/input";
const engine = new Styletron();
const Centered = styled("div", {
display: "flex",
justifyContent: "center",
alignItems: "center",
height: "100%",
});
export default function Hello() {
return (
<StyletronProvider value={engine}>
<BaseProvider theme={LightTheme}>
<Centered>
<StatefulInput />
</Centered>
</BaseProvider>
</StyletronProvider>
);
}Both Base Web and Styletron come with TypeScript.
To read the documentation, please visit baseweb.design. To preview more component examples, please visit baseweb.design/ladle.