HTML Entity for Yuan Character China (元)

Beginner
⏱️ 5 min read
📚 Updated: Jun 2026
🎯 1 Code Example
Unicode U+5143
HTML entity for Yuan Character China (U+5143, 元) — hex, decimal, and CSS tutorial

What You'll Learn

How to display the Yuan character (元) in HTML using hexadecimal, decimal, and CSS escape methods. This character is U+5143 (CJK UNIFIED IDEOGRAPH-5143) in the CJK Unified Ideographs block—the Simplified Chinese character for yuan (CNY) used in mainland China.

Render it with 元, 元, or CSS escape \5143. There is no named HTML entity. Do not confuse 元 with 圆 (U+5706), 圓 (U+5713, Traditional), or the yen sign (¥, U+00A5). Use lang="zh-CN" on Simplified Chinese price content when appropriate.

⚡ Quick Reference — Yuan Character China

Unicode U+5143

CJK Unified Ideographs

Hex Code 元

Hexadecimal reference

HTML Code 元

Decimal reference

Named Entity —

Use numeric codes only

Reference Table
Name           Value
────────────   ──────────
Unicode        U+5143
Hex code       元
HTML code      元
Named entity   (none)
CSS code       \5143
Meaning        Simplified Chinese “yuán” (元, currency unit)
Related        U+5713 = 圓 (Traditional yuan, HK/TW)
               U+5706 = 圆 (variant form)
               U+00A5 = Yen sign (¥, ¥)
               U+FFE5 = Fullwidth yen (￥)
Block          CJK Unified Ideographs (U+4E00–U+9FFF)
1

Complete HTML Example

A simple example showing the Yuan character (元) using hexadecimal code, decimal HTML code, and a CSS content escape:

html
<!DOCTYPE html>
<html lang="zh-CN">
<head>
 <meta charset="utf-8">
 <style>
  #price:after{
   content: "\5143";
  }
 </style>
</head>
<body>
<p>Yuan China (hex): &#x5143;</p>
<p>Yuan China (decimal): &#20803;</p>
<p id="price">Price: 100 </p>
</body>
</html>
Try It Yourself

🌐 Browser Support

U+5143 is widely supported when the page uses UTF-8 and a font with CJK glyphs:

Chrome1+
Firefox1+
Safari1+
Edge12+
Opera4+
Android4.4+
iOS Safari1+

👀 Live Preview

See 元 in a mainland China price context and beside related yuan forms:

Price100 元
Large glyph元
Yuan variants元 Simplified   圓 Traditional   ¥ sign
Numeric refs&#x5143; &#20803; \5143

🧠 How It Works

1

Hexadecimal Code

&#x5143; uses the Unicode hexadecimal value 5143 to display the Yuan character. The x prefix indicates hexadecimal format.

HTML markup
2

Decimal HTML Code

&#20803; uses the decimal Unicode value 20803 to display the same character.

HTML markup
3

CSS Entity

\5143 is used in CSS stylesheets, particularly in the content property of pseudo-elements like ::before and ::after.

CSS stylesheet
=

Same visual result

All three methods produce the glyph: 元. Unicode U+5143 is the Simplified Chinese yuan character. For Traditional Chinese, see Yuan Character Hong Kong Taiwan (圓, U+5713).

✅

Use Cases

The Yuan character (元) is commonly used in:

🇨🇳 China-facing sites

Display prices for mainland China audiences (e.g. 100元).

📄 Financial content

Invoices, reports, and banking in Simplified Chinese.

🛒 E-commerce

Product listings and checkout for mainland China markets.

🏦 Payment UIs

Balances, transactions, and currency labels in zh-CN.

📚 Education

Simplified Chinese language and currency terminology.

🌐 Localization

Multi-language sites with lang="zh-CN" support.

📋 Documentation

Contracts, receipts, and official documents using 元 for CNY.

💡 Best Practices

Do

  • Use lang="zh-CN" and UTF-8 (<meta charset="utf-8">) for Simplified Chinese
  • Choose fonts that include CJK glyphs (e.g. Noto Sans SC, Microsoft YaHei)
  • Use 元 for mainland China; use 圓 for Traditional Chinese (HK/TW)
  • Pick one numeric style (hex or decimal) per project for consistency
  • Pair 元 with proper number formatting (e.g. 100元)

Don’t

  • Confuse 元 (Simplified 元) with 圓 (Traditional 圓) or ¥ (yen sign)
  • Put CSS escape \5143 in HTML text nodes
  • Assume every font renders Simplified Chinese clearly without testing
  • Mix entity styles randomly in one file
  • Expect a named HTML entity for U+5143—use numeric references instead

Key Takeaways

1

Three ways to render 元 in HTML and CSS

&#x5143; &#20803;
2

For CSS stylesheets, use the escape in the content property

\5143
3

Unicode U+5143 — Simplified Chinese yuan (元)

4

Mainland China character; 圓 is the Traditional form for HK/TW

5

Previous: Yin Yang (☯)   Next: Yuan HK/TW (圓)

❓ Frequently Asked Questions

Use &#x5143; (hex), &#20803; (decimal), or \5143 in CSS content. There is no named HTML entity. In UTF-8 you can also type 元 directly.
U+5143 (CJK UNIFIED IDEOGRAPH-5143). CJK Unified Ideographs block. Hex 5143, decimal 20803. The Simplified Chinese character for yuan used in mainland China.
For China-facing websites, Simplified Chinese financial content, mainland China e-commerce, banking and payment interfaces, educational zh-CN content, and any page displaying the native yuan character.
HTML numeric references (&#20803; or &#x5143;) go directly in markup. The CSS escape \5143 is used in stylesheets, typically in the content property of pseudo-elements. Same visual result, different layers of the stack.
Named HTML entities are reserved for commonly used ASCII, Latin-1, and widely recognized symbols. CJK characters like 元 use numeric codes. Use &#20803; or &#x5143; in HTML, or \5143 in CSS.

Explore More HTML Entities!

Discover 1500+ HTML character references — CJK characters, currency symbols, and more.

All HTML Entities →

About the author

Mari Selvan M P
Mari Selvan M P 🔗

Developer, cloud engineer, and technical writer

  • Experience 12 years building web and cloud systems
  • Focus Full Stack Development, AWS, and Developer Education

I write practical tutorials so students and working developers can learn by doing—from databases and APIs to deployment on AWS.

AWS Certified Developer – Associate (Credly)

8 people found this page helpful

Yin Yang (☯) Yuan Character Hong Kong Taiwan (圓)