gitwtfhub

wtf is weui?

tencent/weui — explained in plain English

Analysis updated 2026-06-21

★ 27,370HTMLAudience · developerComplexity · 1/5LicenseSetup · easy

TL;DR

WeUI is the official UI component library from WeChat's design team for building web pages inside WeChat that look and feel like a native part of the app, buttons, dialogs, list rows, and more in WeChat's own visual style.

Mindmap

mindmap
  root((WeUI))
    Platform
      WeChat browser
      Mobile web
    Components
      Buttons and cells
      Dialogs and toasts
      Action sheets
      Progress bars
    Purpose
      Native WeChat feel
      Consistent styling
    License
      MIT open source

Code map

Detail Auto

An interactive map of this repo's files and how they connect — its source is parsed live in your browser. Click Visualize to build it.

filefunction / class

Why would anyone build with this?

REASON 1

Build a WeChat mini web app or service page that matches the native WeChat look so users feel at home

REASON 2

Add WeChat-style buttons, toast notifications, and list rows to a mobile landing page running in the WeChat browser

REASON 3

Create a campaign or checkout page inside WeChat with action sheets, progress bars, and confirm dialogs

What's in the stack?

HTMLCSS

How it stacks up

tencent/weuidwmkerr/hacker-lawsaishwaryanr/awesome-generative-ai-guide
Stars27,37027,08826,577
LanguageHTMLHTMLHTML
Setup difficultyeasyeasyeasy
Complexity1/51/51/5
Audiencedevelopergeneralpm founder

Figures from each repo's GitHub metadata at analysis time.

How do you spin it up?

Difficulty · easy Time to first run · 5min
Free to use for any purpose including commercial projects, as long as you keep the copyright notice.

Wtf does this do

WeUI is a UI framework (a collection of ready-made visual building blocks) officially designed by the WeChat Design Team and tailored for building web pages inside WeChat, the messaging and super-app platform used widely in China. Its goal is to make WeChat-based web services look and feel consistent with the native WeChat app experience. It provides common mobile interface components like buttons, cells (list rows), dialogs (pop-up windows), progress bars, toast notifications (brief status messages), article layouts, action sheets (bottom slide-up menus), and icons. Because these match WeChat's own visual style, apps built with WeUI feel native to WeChat users rather than out of place. You would use WeUI when building a mini web app, a service page, or a campaign landing page that runs inside the WeChat browser, where matching the familiar WeChat look is important for user trust and comfort. It is written in HTML and CSS and is available as an open-source package under the MIT license.

Yoink these prompts

Prompt 1
Show me how to use WeUI to build a mobile product listing page with list rows, an action sheet, and a confirm dialog for WeChat.
Prompt 2
How do I install WeUI in my project and add a styled button and toast notification to a webpage inside WeChat?
Prompt 3
Create a WeUI form page with labeled input fields and a submit button that matches the WeChat native design.
Prompt 4
What WeUI components can I use to show a loading spinner while my page is fetching data inside WeChat?

Frequently asked questions

wtf is weui?

WeUI is the official UI component library from WeChat's design team for building web pages inside WeChat that look and feel like a native part of the app, buttons, dialogs, list rows, and more in WeChat's own visual style.

What language is weui written in?

Mainly HTML. The stack also includes HTML, CSS.

What license does weui use?

Free to use for any purpose including commercial projects, as long as you keep the copyright notice.

How hard is weui to set up?

Setup difficulty is rated easy, with roughly 5min to a first successful run.

Who is weui for?

Mainly developer.

View the repo → Decode another repo

This repo across BitVibe Labs

Don't trust strangers blindly. Verify against the repo.

Other repos in this lane