Build better with OSCL
Open-source React components and practical blocks.
Beautiful little pieces for whatever comes next.
Open components
15 considered pieces for your next interface.
Keyboard friendly
Thoughtful focus, labels, and feedback.
TypeScript included
Clear props. Helpful hints. Fewer guesses.
Copy what you need
Real source, ready to make your own.
Compose together
Small parts that work as a whole.
A real React package
Install locally. Import. Start building.
Make it your own
Light, dark, and your own design tokens.
Find it faster
Search the library with a single shortcut.
From idea to interface
Try the components. Peek at the code. Take the pieces you need.
Input
A real label. A little extra context.
Find your starting point
A small library with useful defaults.
Make it feel like you
Your colors, your content, your context.
Keep building
Copy the source and make it yours.
Every piece, connected
A consistent set of components. Compose them into something entirely your own.
Good on their own. Buttons, fields, and feedback with thoughtful defaults.
Better as a whole. Shared tokens and predictable props keep everything in tune.
The bigger picture, built in
Starting points for everyday interfaces. Working previews, ready for your ideas.
Your code. Your choices.
Read every line. Change every token. Keep the parts that work for you.
import { Button, Card } from "oscl-ui";
import "oscl-ui/styles.css";
export function YourNextIdea() {
return (
<Card>
<Button>Build something good</Button>
</Card>
);
}A little less friction.
Try it here, or bring the components into your own React project.
Includes the React components, types, and scoped CSS. Installation guide
Make it feel like you.
Start with the defaults. Let your colors, context, and ideas do the rest.
You can change your mind anytime.
You can change your mind anytime.
Build better with OSCL
The pieces are here. See what you can make.