Recently, when importing long X posts into my WeChat Official Account, I couldn't find a formatting tool that felt right. Having created several IP-related Skills recently, I thought: why not build a formatting tool for myself that carries a bit of an IP-exclusive feel?
Initially, I just wanted to solve my own formatting issues, but as I worked on it, more ideas kept coming: Could the color scheme follow the IP? Could characters be placed in chapters? Could Markdown, TXT, code blocks, and tables be handled all at once? Could it be used directly on mobile?
Since I've come this far, I shouldn't keep it to myself; I should give everyone another option for Official Account formatting. Thus, Punk Weipai was born.
The effect I wanted was straightforward: put the slightly messy Markdown original on the left, press a button, and on the right comes a WeChat article with organized titles, quotes, code blocks, and image pacing.
The website is ready to use directly:
https://weipai.iamadrianpunk.com
When you first open the site, you'll see a "letter" sent by Punk. The novice tutorial will introduce color schemes, original draft import, preview copying, and fixed endings in sequence; if you're already familiar with the process, you can skip it directly.
1. It solves the most annoying thing first
The workflow of Punk Weipai is very direct: put the Markdown or TXT original on the left, and the WeChat formatting is generated in real-time on the right. After confirming the effect, click "Copy to Official Account" and paste it into the WeChat Official Account web editor.
The content I spent time processing—the parts most prone to issues in long articles—includes:
- Article titles, chapter titles, and secondary titles;
- Ordered lists, unordered lists, and multi-level nested lists;
- Quotes, dividers, bold text, and inline code;
- Local images, tables, and multiple consecutive code blocks;
- Paragraph spacing, line spacing, and fonts suitable for Official Account reading.
If the original draft has clear title levels, it will judge chapters based on Markdown title sizes. Secondary titles with numbers retain them, while those without use a thick vertical line; general points use solid dots that change with the theme color.
Code blocks will retain the macOS window bar, and tables use three-line tables.
2. The entire process takes only three steps
1. Insert the original draft
You can paste Markdown directly or import .md, .txt, or article packages with local images. The page opens with a full-featured example, including titles, quotes, lists, images, tables, and code blocks, so you can see what each syntax looks like at a glance.
2. Choose color scheme and chapter style
The tool comes with presets like Punk Color, Retro Trend, Red-Blue CP, and Vitality Orange. Each scheme includes a theme color, an accent color, and a near-white light color; the body background defaults to white.
You can also upload your own IP image. The system will extract representative colors from the image and generate three schemes: "IP Name Color 1, 2, and 3." Choose the one closest to your style and then continue to fine-tune.
The Color Lab turns this into a visible process: extract representative colors from the IP, expand them into three different schemes, and finally leave four color roles that can actually be used for formatting.
After selecting a color scheme, you can continue to adjust it piece by piece. Each color block can open "Function Selection" to decide if it's used for the body background, titles, bold emphasis, title decoration, dividers, list markers, code blocks, tables, inline code text, inline code background, or quotes; the same color can also serve multiple purposes. For example, I let blue handle titles and code blocks, yellow handle bolding, lists, and dividers, and leave the near-white light color for quotes and inline code backgrounds.
If you don't have an IP, you can also enter "Custom Color" to modify HEX color codes, color scheme names, and color uses. This entry is for those willing to adjust colors themselves and doesn't force everyone to upload an avatar first.
Chapter styles can also be switched directly. Currently, there are 9 options: thick underline, slash, left vertical line, box, square brackets, double circles, dot matrix, top-placed number, and quotation marks. The menu shows the actual effect first, so you don't have to guess by name. After switching, the chapters of the entire article will update together, no need to go back to Markdown to modify them one by one.
If "Chapter IP" is enabled, the character will stand on the title horizontal line for short titles;
For longer titles that might wrap, the IP will automatically move to the center above the title to avoid crowding the body text.
Color schemes, chapter styles, and whether the IP is displayed are independent and can be freely combined according to your content.
3. Preview, then copy to Official Account
The writing area and preview area update synchronously. When you want to focus on checking the article, you can open "Focus Preview" to keep only the final WeChat draft; it can be used on both computer and mobile.
4. Mobile adaptation
A separate set of adaptations has been made for the mobile side, so the entire process doesn't require returning to a computer:
- The formatting tools are tucked into a hamburger menu in the top right to avoid horizontal scrolling and blocking the body text;
- Article width, padding, and preview methods automatically adjust to the mobile screen.
So you can complete the entire "Import draft—Adjust style—Check preview—Copy to Official Account" workflow on your phone. When you need to change an article temporarily, you don't need to open a computer just for formatting.
Finally, click "Copy to Official Account" to paste the full rich text into the WeChat Official Account web editor. Titles, quotes, lists, tables, and code blocks will all be carried over, no need to adjust them paragraph by paragraph.
3. A few details I use repeatedly
First is the Fixed Ending.
Content like author introductions, account positioning, and follow prompts needs to be written for every article and is easy to miss. Now you can save and enable a fixed ending in advance; regardless of whether this text is in the original draft, it will be automatically appended to the end of the formatted result, separated by a divider.
Fixed ending will inherit the current article's font and theme color scheme. The content is saved in the current browser and needs to be set again if you switch devices.
Second is Partial Color Change. You can choose auto, black, white, or custom colors for the body text, or directly select a specific segment of text in the preview to change only its color. This is very convenient for highlighting commands in tutorials or key numbers in reviews.
Third is IP following chapters. After uploading a character image, you can decide whether to have it appear next to each chapter title. Color schemes and IP display are two independent switches: you can use your own color scheme without showing the character, or switch to a recommended color scheme while keeping the character.
4. Who will find this useful?
If your articles are mainly completed in Word and you rarely use code, tables, or Markdown, this tool might not be a necessity.
The following scenarios are more suitable:
- Frequently converting long X posts, notes, or Markdown into WeChat articles;
- Using AI to write first drafts but not wanting to re-format in the WeChat backend;
- Writing AI tool tutorials with many code blocks and inline code;
- Operating a personal account, studio, or multiple different IPs simultaneously;
- Wanting to maintain a consistent visual style for the Official Account without adjusting formats from scratch every time.
Punk Weipai currently focuses on formatting. It won't rewrite articles for you, nor does it have AI-generated covers. The scope is narrow, so after opening the page, just put in the draft, adjust the style, and copy to publish.
5. You can run this minimum workflow first
When using it for the first time, don't rush to study all the settings. Follow these three steps:
- Open the website and look at the right-side preview of the default example;
- Paste your Markdown on the left and choose a ready-made color scheme;
- Click "Copy to Official Account" and paste it into the draft box to check once.
Once this path is clear, go ahead and upload your IP, adjust color codes, switch chapter styles, and save fixed endings.
The phrase I set for this tool is:
Let every piece of good content have a good layout.
If you also often get stuck at "the article is finished, but the Official Account formatting isn't," you can try it directly:
https://weipai.iamadrianpunk.com
About the Author
Punk｜Master of Management, USTC｜AI Prompts, AI Beginner Tutorials｜Author of Punk Series Skills｜Earned 8 figures in 3 months｜Learn in Public｜FDE article views 2.4m｜@AdrianPunk115
