Fully Open Source

Localization UIs,
built for copy & paste.

Open-source localization UI components for React and Tailwind CSS. Ship language switchers and locale UIs faster — with the community.

Get StartedView on GitHub
language-switcher.tsx
import { LanguageSwitcher } from "@/components/elements/language-switcher";

export function Header() {
  return (
    <LanguageSwitcher
      locales={[
        { code: "en", label: "English" },
        { code: "fr", label: "Français" },
        { code: "hi", label: "हिन्दी" },
        { code: "ar", label: "العربية" },
      ]}
      onLocaleChange={(code) => i18n.changeLanguage(code)}
      dir="rtl-ready"
    />
  );
}

Every localized app needs these. Build them once, share them forever.

Babelize Elements turns the repetitive work of building localized interfaces into a shared, open-source toolbox.

Copy & Paste

No installs, no lock-in. Copy the code into your project and ship — full source control, always.

Localization-first

Pluralization, RTL, and locale data built into every component. Localized by default, not as an afterthought.

Accessible

Keyboard support, ARIA labels, and WCAG-aware markup. Localized UIs that work for everyone.

Community-built

MIT-licensed and free forever. Components are built by contributors and reviewed by maintainers.

The localization toolbox, growing every week

Components ship as the community builds them. Each card below is an open issue waiting for its first contributor.

From zero to localized in minutes

Components are copy-paste by design. No packages to install, no config to wire up.

01

Pick a component

Browse the docs or the repository, find the component you need, and copy its source into your project.

02

Drop it in your app

Import the component and pass your locale data. Works with next-intl, react-i18next, or your own i18n setup.

03

Contribute it back

Built something the community needs? Open a pull request and get your component merged for everyone.

Read the getting-started guide
Contribute

Built by the community, for every localized app.

Join the Babelize Elements contributors. Pick an open issue, build a component, and ship it to developers around the world.

Read the contribution guideBrowse open issues

Got questions? We've got answers.

No. Babelize Elements components are copy-paste by design. Copy the source into your project and use it — no registry, no runtime dependency, no lock-in.

Absolutely. Since you own the code, every component is fully customizable with Tailwind classes and props. Change colors, spacing, and behavior however you like.

Every merged component is reviewed by maintainers and follows our accessibility, TypeScript, and localization checklist before it's documented on this site.

Yes — MIT-licensed and free forever. The code lives on GitHub, contributions are welcome, and you can use the components in any project, commercial or not.

Browse the open issues on GitHub, build the component following the contribution guide, and open a pull request. Maintainers review and merge it, and it ships to the docs.