Moddular MFE
A collection of accessible, themeable, and responsive micro-frontend components built with Next.js & SCSS.
Theme Toggle
Switch between themes — all components react instantly.
Active: dark
Components
Interactive demos — try toggling themes to see live adaptation.
HeroBanner
Premium Section
FAQ
Variant: card
Accordion
Variant: separated
All components follow WAI-ARIA patterns with proper keyboard navigation, focus management, and screen reader support.
Ratings
Sizes & Icons
ProfileCard
Social Media Integration
Loading...
Akash Ranjan
Full Stack Developer focused on React & Web Performance. Founder of ICW Technologies.
Ready to Integrate?
Our components are built for maximum reusability. Here is how to get started in seconds.
Install Dependency
Add the library to your React project directly via GitHub.
npm install https://github.com/vatsaakash/moddular-mfeWrap your App
Import the global styles, then wrap your app with ThemeProvider.
import 'moddular-mfe/src/app/globals.scss';
import { ThemeProvider } from 'moddular-mfe';Import & Use
Drop any component into your UI and customize via props. View the Storybook code for live snippets.
import { Ratings } from 'moddular-mfe';
<Ratings
defaultValue={3}
icon="star"
max={5}
showLabel
size="md"
/>Interactive Storybook
Every component is fully documented in our interactive Storybook. Tweak props, test accessibility, and explore all variations live.
Open Storybook ↗