Leptonic is a rich component library for the Leptos web framework.

It provides "ready to be used" components for capturing user input through buttons, inputs fields, select inputs, sliders, date & time inputs or even a rich text editor. Well known mechanisms for providing user-feedback are also available, ranging from modal windows, toast messages and alerts to progress indicators. Leptonic also includes components helping you lay out all these elements on your pages. These include stacks, a full grid system, tabs and collapsibles as well as components for app bars and side drawers. Common tasks such as linking to other parts in or outside your site or including a plethora of icons are also made simple.

Explore the available components and other features using the side menu to get acquainted with what Leptonic has to offer.

If you want to dive right in, follow our Installation instructions.

Need help?#

If you get stuck at any point integrating or using Leptonic, these are things you may find helpful:

  • Look for help in the Leptos Discord server.
  • If you think you encountered a bug, open a ticket in our repository
  • Compare the implementation of this book at GitHub with what you currently have.


If you have anything to say about Leptonic, be it a component you miss, a feature you feel missing, or a bug you encountered, feel free to contribute back to the project by reaching the community or us through

  • the Leptos Discord server or
  • the Issues section of the Leptonic repository.

Writing a component library is a big undertaking. Feel free to contribute by writing new or updating existing code yourself. As more people are on board, more and better ideas, concepts and implementation details follow. Code contributions are always welcomed!