Monster Logo

Monster JS

HTML-first web components for JavaScript applications.

HTML-first Web Components for JavaScript Apps

Monster is the foundation of our front-end projects and simplifies the creation of websites and applications. The library includes a wide range of documented, customizable web components. From buttons that provide feedback on user actions to a JavaScript data table with sorting, filtering, datasources and pagination, Monster gives you the tools you need to build consistently with HTML and JavaScript.

As an open-source project, Monster is constantly being expanded and refined by a dedicated team. Our goal is to constantly improve the functionality and at the same time make it intuitive to use to make your everyday work easier.

An abstract illustration of geometric shapes
Click Me!
<monster-button id="my-button">
   Click Me!
</monster-button>

const myButton = document.getElementById('my-button');
    myButton.setOption("actions.click", () => {
        myButton.setState("successful", 2000);
})

Below, you'll find the "Click Me!" button. When clicked, a checkmark briefly appears to confirm the operation was successful.

The accompanying source code, shown on the right, uses HTML to define the button and JavaScript to set its state to "successful" for 2000 milliseconds following the click.

This demonstrates a straightforward way to provide immediate feedback on user interfaces.

Web Components for Tomorrow's Needs

Customizable Components

Monster offers a diverse suite of web components that blend seamlessly into any design. Customize colors, shapes, and functionalities to fit your specific needs.
Optimized for consistent performance across all screen sizes, our components ensure a smooth user experience on every device.

Efficient Integration & Maintenance

With Monster's modular structure, you can swiftly add or remove components without overhauling your entire codebase.
This feature streamlines project maintenance and expedites the deployment of new features, enhancing overall productivity.

Future-Proof Technology

Committed to innovation, we continuously update Monster to align with the latest web standards and browser technologies.
This proactive approach ensures that your projects remain compatible and secure against future technological shifts.

The current width of the area is too small to display the content correctly.