HTML Entity for Lowercase Esszed (ß)

Beginner
⏱️ 5 min read
📚 Updated: Jun 2026
🎯 1 Code Example
Unicode U+00DF

What You'll Learn

How to display the eszett (ß) in HTML using named entity, hexadecimal, decimal, and CSS escape methods. Also called lowercase esszed, sharp s, or scharfes S, this letter is used in German orthography and appears in words such as Straße (street), groß (big), and Fuß (foot). It is U+00DF in the Latin-1 Supplement block.

Render it with ß, ß, ß, or CSS escape \00DF. The named entity ß is often the most readable option in HTML source.

⚡ Quick Reference — Lowercase Esszed Entity

Unicode U+00DF

Latin-1 Supplement

Hex Code ß

Hexadecimal reference

HTML Code ß

Decimal reference

Named Entity ß

Most readable option

Reference Table
Name           Value
────────────   ──────────
Unicode        U+00DF
Hex code       ß
HTML code      ß
Named entity   ß
CSS code       \00DF
Meaning        Latin small letter sharp s
Also known as  Eszett / lowercase esszed
Block          Latin-1 Supplement (U+0080–U+00FF)
1

Complete HTML Example

A simple example showing the eszett (ß) using hexadecimal code, decimal HTML code, the named entity, and a CSS content escape:

html
<!DOCTYPE html>
<html>
<head>
 <style>
  #point:after{
   content: "\00DF";
  }
 </style>
</head>
<body>
<p>Symbol (hex): &#xDF;</p>
<p>Symbol (decimal): &#223;</p>
<p>Symbol (named): &szlig;</p>
<p id="point">Symbol (CSS): </p>
</body>
</html>
Try it Yourself

🌐 Browser Support

The eszett (ß) and the named entity &szlig; are supported in all modern browsers:

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

👀 Live Preview

See the eszett (ß) in German contexts:

Large glyphß
GermanStraße, groß, Fuß, weiß
Named entity&szlig; renders as ß
Not the same asdouble ss in all contexts (e.g. Swiss German uses ss)
Numeric refs&#xDF; &#223; &szlig; \00DF

🧠 How It Works

1

Hexadecimal Code

&#xDF; uses the Unicode hexadecimal value DF to display the character. The x prefix indicates hexadecimal format.

HTML markup
2

Decimal HTML Code

&#223; uses the decimal Unicode value 223 to display the same character. One of the most commonly used methods in HTML.

HTML markup
3

Named Entity

&szlig; is the standard named entity for ß—readable in source HTML and part of the HTML5 entity set.

HTML markup
4

CSS Entity

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

CSS stylesheet
=

Same visual result

All four methods produce the glyph: ß. Unicode U+00DF sits in Latin-1 Supplement. In German, ß is a distinct letter—do not substitute plain s or ss when ß is required for correct spelling.

Use Cases

The eszett (ß) is commonly used in:

🇩🇪 German

Correct spelling of German words (e.g. Straße, groß, Fuß, weiß).

🌐 Internationalization

Websites and apps targeting German-speaking audiences in Germany and Austria.

📚 Language Learning

German vocabulary, grammar sites, and dictionary entries.

📄 Publishing

Books, articles, and editorial content with German names and place names.

🔍 Search & SEO

Correct rendering so users can find content searching for words like “Straße.”

📧 Forms & Input

Address fields, name inputs, and user data that may contain German characters.

🎨 Typography

Typographic projects and design work requiring the sharp s glyph.

💡 Best Practices

Do

  • Use &szlig; in HTML when possible for readability
  • Serve pages as UTF-8; you can also type ß directly in UTF-8 source
  • Set lang="de" on German content for accessibility and SEO
  • Use fonts that support Latin-1 Supplement characters
  • Use ß where German orthography requires it (Germany/Austria)

Don’t

  • Substitute ss when ß is required for correct German spelling
  • Confuse ß with the Greek beta β or other similar-looking characters
  • Put CSS escape \00DF in HTML text nodes
  • Assume all fonts render the eszett glyph identically
  • Mix entity styles randomly in one file

Key Takeaways

1

Four references render ß; named entity is most readable

&#xDF; &#223; &szlig;
2

For CSS stylesheets, use the escape in the content property

\00DF
3

Unicode U+00DF — LATIN SMALL LETTER SHARP S (eszett)

4

Essential for German text and internationalized web content

❓ Frequently Asked Questions

Use &szlig; (named), &#xDF; (hex), &#223; (decimal), or \00DF in CSS content. All four methods render ß correctly.
U+00DF (LATIN SMALL LETTER SHARP S). Latin-1 Supplement block. Hex DF, decimal 223. The eszett is the German sharp s used in German orthography.
In German text (e.g. Straße, groß, Fuß), German names and place names, internationalized websites for German-speaking audiences, and any content requiring correct German spelling.
The named entity &szlig; is used in HTML content. The CSS entity (\00DF) is used in CSS, e.g. in the content property of pseudo-elements. Both produce ß but in different contexts.
The named entity &szlig; is easier to read and maintain in hand-written HTML. Numeric codes (&#223; or &#xDF;) are useful when generating HTML programmatically. All produce the same character ß.

Explore More HTML Entities!

Discover 1500+ HTML character references — accented letters, 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.

8 people found this page helpful