HTML Entity for Lowercase O Umlaut (ö)

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

What You'll Learn

How to display the lowercase o with diaeresis (ö) in HTML using named entity, hexadecimal, decimal, and CSS escape methods. Also called o umlaut, this character is U+00F6 in the Latin-1 Supplement block—the letter o with two dots above.

Render it with ö, ö, ö, or CSS escape \00F6. HTML provides the named entity ö. In UTF-8 documents you can also type ö directly. Do not confuse ö with ø (o slash) or õ (o tilde).

⚡ Quick Reference — Lowercase O Umlaut Entity

Unicode U+00F6

Latin-1 Supplement

Hex Code ö

Hexadecimal reference

HTML Code ö

Decimal reference

Named Entity ö

HTML5 named entity

Reference Table
Name           Value
────────────   ──────────
Unicode        U+00F6
Hex code       ö
HTML code      ö
Named entity   ö
CSS code       \00F6
Meaning        Latin small letter o with diaeresis
Related        U+00D6 = Ö (uppercase, Ö)
Block          Latin-1 Supplement (U+0080–U+00FF)
1

Complete HTML Example

A simple example showing the lowercase o umlaut (ö) using the named entity, hexadecimal code, decimal HTML code, and a CSS content escape:

html
<!DOCTYPE html>
<html>
<head>
 <style>
  #point:after{
   content: "\00F6";
  }
 </style>
</head>
<body>
<p>Symbol (hex): &#x00F6;</p>
<p>Symbol (decimal): &#246;</p>
<p>Symbol (named): &ouml;</p>
<p id="point">Symbol (CSS): </p>
</body>
</html>
Try It Yourself

🌐 Browser Support

The lowercase o umlaut (ö) and the named entity &ouml; are supported in all modern browsers:

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

👀 Live Preview

See the lowercase o umlaut (ö) in language contexts:

Large glyphö
Germanschön  |  möchten  |  Köln
Swedishför  |  öl  |  stöd
Turkishgöl  |  önce  |  göz
Named entity&ouml; renders as ö
UppercaseÖ (U+00D6) — use &Ouml;
Not the same asø (stroke)  |  õ (tilde)  |  plain o
Numeric refs&#x00F6; &#246; &ouml; \00F6

🧠 How It Works

1

Named Entity

&ouml; is the HTML named entity for o umlaut (diaeresis)—readable in source HTML and widely used for German and Nordic content.

HTML markup
2

Hexadecimal Code

&#x00F6; uses the Unicode hexadecimal value 00F6 to display the character. The x prefix indicates hexadecimal format.

HTML markup
3

Decimal HTML Code

&#246; uses the decimal Unicode value 246 to display the same character. A common method when a numeric reference is needed.

HTML markup
4

CSS Entity

\00F6 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+00F6 sits in Latin-1 Supplement. Uppercase equivalent: U+00D6 (Ö, &Ouml;). Do not confuse with ø (stroke) or õ (tilde).

Use Cases

The lowercase o umlaut (ö) is commonly used in:

🇩🇪 German

Essential for correct spelling (schön, möchten). ö is a distinct letter in the German alphabet.

🇳🇴 Swedish & Finnish

Used in Swedish (för, öl) and Finnish orthography. Critical for Nordic localization and search.

🇹🇷 Turkish

Used in Turkish (göl, önce, göz). ö is a separate letter in the Turkish alphabet.

🌐 Multilingual sites

Menus, content, search, and forms for Germanic and Turkic language audiences.

📚 Language learning

Lessons, dictionaries, and apps teaching German, Swedish, Finnish, or Turkish spelling.

♿ Accessibility

Using U+00F6 or &ouml; with proper lang attributes ensures assistive technologies pronounce text correctly.

⚙ Programmatic HTML

When generating markup, &ouml; or &#246; guarantees correct umlaut-o output.

💡 Best Practices

Do

  • Use U+00F6 (ö) for German, Swedish, Finnish, Turkish, and related languages
  • Prefer &ouml; over numeric codes when using entities—it is more readable
  • Set lang="de", lang="sv", lang="fi", or lang="tr" on content blocks
  • Serve pages as UTF-8; you can also type ö directly in UTF-8 source
  • Distinguish ö from ø (stroke), õ (tilde), and plain o

Don’t

  • Substitute ø (stroke) or plain o when ö is required
  • Use “oe” as a permanent replacement for ö in German proper names when ö is standard
  • Confuse ö with õ (tilde) or ô (circumflex)
  • Put CSS escape \00F6 in HTML text nodes
  • Mix entity styles inconsistently within the same project

Key Takeaways

1

Four references render ö; named entity is &ouml;

&ouml; &#x00F6; &#246;
2

For CSS stylesheets, use the escape in the content property

\00F6
3

Unicode U+00F6 — LATIN SMALL LETTER O WITH DIAERESIS

4

German, Swedish, Finnish, Turkish; uppercase is Ö (&Ouml;)

❓ Frequently Asked Questions

Use the named entity &ouml;, hexadecimal &#x00F6;, decimal &#246;, or \00F6 in CSS content. The named entity is the most readable. In UTF-8 you can also type ö directly.
U+00F6 (LATIN SMALL LETTER O WITH DIAERESIS). Latin-1 Supplement block. Hex 00F6, decimal 246. Used in German, Swedish, Finnish, Turkish, and other languages. Uppercase form is U+00D6 (Ö, &Ouml;).
When displaying German, Swedish, Finnish, Turkish, or other text that uses o with diaeresis (e.g. schön, för, göl), in multilingual websites, and when you need a reliable character reference.
Yes. The named HTML entity for ö is &ouml;. You can also use &#x00F6;, &#246;, or the CSS entity \00F6. In UTF-8 pages you can type ö directly.
ö (U+00F6) is o with diaeresis, used in German, Swedish, Finnish, and Turkish. ø (U+00F8) is o with stroke, used in Danish and Norwegian (&oslash;). They are different letters with different pronunciations.

Explore More HTML Entities!

Discover 1500+ HTML character references — 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