atomico
## Atomico@2   [](https://twitter.com/atomicojs) [](https://discord.gg/7z3rNhmkNE) [](https://atomico.gitbook.io/doc/) [](https://stackblitz.com/edit/atomico?file=src%2Fmy-component.tsx) [](http://npmjs.com/atomico) [](https://bundlephobia.com/result?p=atomico) ## Build web components using a syntax similar to React JS. 🚀 1. **Scalable and reusable interfaces**: Build once with Atomico, run anywhere — React, Vue, Svelte, HTML, WebView, you name it. Feels super simple — especially if you already know React. 🚀 2. **Open communication**: Atomico makes building and using web components easy — delivering a truly authentic dev experience. ⚡ 3. **Performance**: Atomico is fast — [actually 60% faster than React](https://atomicojs.dev/perf). Your apps will fly! 🚀 ### Atomico is fully type-friendly — full autocomplete powered by your IDE, TypeScript, and AI. 🚀 ```tsx import { c } from "atomico"; const MyComponent = c( ({ message }) => ( <host> <h1>Helo {message}</h1> </host> ), { props: { message: String } } ); customElements.define("my-component", MyComponent); ``` ## Summary Atomico is a modern micro-library created by Matias Trujillo, aka [@UpperCod](http://linkedin.com/in/uppercod) , designed to simplify web component development. It replaces the need for classes and contexts with functions and scoped logic, supporting attributes, properties, methods, and events — making your components cleaner and easier to maintain. ## Join the Team by Contributing to Atomico We’re happy to help with any support you need to make your contribution. Check out [CONTRIBUTING.md](./CONTRIBUTING.md) for everything you need to get started contributing to Atomico’s web component code. Not all contributions are code-related — you can also help us improve the [Atomico documentation](https://atomico.gitbook.io/doc/) . A good place to start is by [adding](https://github.com/atomicojs/atomico/issues/new/choose) or picking up an item from the Atomico Roadmap . By default, all issues will appear in the backlog column of Atomico’s roadmap for refinement. Let’s make Atomico better — together! 🚀