react-legos
react-legos copied to clipboard
CSS-driven React LEGO brick components
react-legos

Try it out in Storybook.
Make a LEGO brick!
import Brick, { shapes } from 'react-legos'
...
<Brick shape={shapes['twoByFour']} />
Props
Prop | Default | Description |
---|---|---|
shape |
The shape of the brick. A grid of true/false values to determine if the index is a space or filled. | |
size |
medium |
The size of the brick: small, medium, or large. |
style |
Optional style param, useful for z-indexing and placing bricks on top of one another. | |
color |
#eee |
The color of the brick, Can use colors in lib/colors.js , which correspond to this list. |
opacity |
1 | For making the brick transparent. |
optimize |
true |
Disable to render all sides of bricks, including invisible ones. |
Issues
If you find any issues with this component, please report them!
Note
LEGO and the LEGO logo are trademarks and/or copyrights of the LEGO Group. This is not at all affiliated with The LEGO Group, and was simply a project of mine using the LEGO name as a proprietary eponym.