How could I create a new component with Code Pen

I find a lot of good CSS or animation effects on the Code Pen platform, I’d like to copy them to create customized components. May I? Is it the open source? I have found some new components in BS are created from Code Pen, if it is non-infringing, how can I do it?

There isn’t a single step “import codepen” tool in Bootstrap Studio, but it is relatively straightforward to achieve this. You can try pasting the HTML inside a Custom Code component. For the CSS and JS you will need to create files in the Design panel on the bottom right. Then you can use the Add to Library feature to add the result as a user component.


All the code posted on Codepen follows the MIT open source policy, so you are free to copy anything you find there and use it. However, if the code has a license (most does not), you must follow the license restrictions that accompany it.

1 Like

Thanks for your answer

Thanks for your reminding