[{"data":1,"prerenderedAt":919},["ShallowReactive",2],{"guide-html-entities-typography-symbols":3},{"id":4,"title":5,"body":6,"date":909,"description":910,"extension":911,"meta":912,"navigation":913,"path":914,"readingTime":915,"seo":916,"stem":917,"__hash__":918},"guides\u002Fguides\u002Fhtml-entities-typography-symbols.md","HTML Entities for Typography and Symbols: A Practical Guide",{"type":7,"value":8,"toc":896},"minimark",[9,14,18,30,34,45,131,183,186,190,193,256,259,287,291,294,376,383,387,493,496,500,644,648,779,783,822,826,855,859,880,884,892],[10,11,13],"h2",{"id":12},"why-typography-entities-matter","Why Typography Entities Matter",[15,16,17],"p",{},"Good typography is invisible — bad typography stands out. When a curly quote renders as a straight mark, an em dash becomes a double hyphen, or a currency symbol breaks into a question mark, readers notice. HTML entities give you reliable control over these characters across browsers, encodings, and devices.",[15,19,20,21,25,26,29],{},"Using the right entity instead of a keyboard approximation signal professionalism. A proper em dash (",[22,23,24],"code",{},"—",") communicates differently from a double hyphen (",[22,27,28],{},"--","), and correct quotation marks shape how people read your content.",[10,31,33],{"id":32},"quotation-marks","Quotation Marks",[15,35,36,37,40,41,44],{},"Straight quotes (",[22,38,39],{},"\""," and ",[22,42,43],{},"'",") are keyboard conveniences, not typographic characters. Professional content uses curly quotes:",[46,47,48,67],"table",{},[49,50,51],"thead",{},[52,53,54,58,61,64],"tr",{},[55,56,57],"th",{},"Character",[55,59,60],{},"Entity",[55,62,63],{},"Renders As",[55,65,66],{},"Use",[68,69,70,86,101,116],"tbody",{},[52,71,72,76,81,83],{},[73,74,75],"td",{},"Left double",[73,77,78],{},[22,79,80],{},"“",[73,82,39],{},[73,84,85],{},"Opening double quote",[52,87,88,91,96,98],{},[73,89,90],{},"Right double",[73,92,93],{},[22,94,95],{},"”",[73,97,39],{},[73,99,100],{},"Closing double quote",[52,102,103,106,111,113],{},[73,104,105],{},"Left single",[73,107,108],{},[22,109,110],{},"‘",[73,112,43],{},[73,114,115],{},"Opening single quote, apostrophe",[52,117,118,121,126,128],{},[73,119,120],{},"Right single",[73,122,123],{},[22,124,125],{},"’",[73,127,43],{},[73,129,130],{},"Closing single quote",[132,133,138],"pre",{"className":134,"code":135,"language":136,"meta":137,"style":137},"language-html shiki shiki-themes github-light github-dark","\u003Cp>“I can’t believe it,” she said.\u003C\u002Fp>\n\u003C!-- \"I can't believe it,\" she said. -->\n","html","",[22,139,140,176],{"__ignoreMap":137},[141,142,145,149,152,155,158,161,163,166,168,171,173],"span",{"class":143,"line":144},"line",1,[141,146,148],{"class":147},"sVt8B","\u003C",[141,150,15],{"class":151},"s9eBZ",[141,153,154],{"class":147},">",[141,156,80],{"class":157},"sj4cs",[141,159,160],{"class":147},"I can",[141,162,125],{"class":157},[141,164,165],{"class":147},"t believe it,",[141,167,95],{"class":157},[141,169,170],{"class":147}," she said.\u003C\u002F",[141,172,15],{"class":151},[141,174,175],{"class":147},">\n",[141,177,179],{"class":143,"line":178},2,[141,180,182],{"class":181},"sJ8bj","\u003C!-- \"I can't believe it,\" she said. -->\n",[15,184,185],{},"Many content management systems auto-convert straight quotes to curly quotes, but when you write raw HTML, you need the entities.",[10,187,189],{"id":188},"dashes-and-hyphens","Dashes and Hyphens",[15,191,192],{},"English uses three horizontal line characters with distinct meanings:",[46,194,195,207],{},[49,196,197],{},[52,198,199,201,203,205],{},[55,200,57],{},[55,202,60],{},[55,204,63],{},[55,206,66],{},[68,208,209,225,241],{},[52,210,211,214,220,222],{},[73,212,213],{},"Hyphen",[73,215,216,219],{},[22,217,218],{},"-"," (direct)",[73,221,218],{},[73,223,224],{},"Compound words: well-known",[52,226,227,230,235,238],{},[73,228,229],{},"En dash",[73,231,232],{},[22,233,234],{},"–",[73,236,237],{},"–",[73,239,240],{},"Ranges: pages 10–12, 2024–2026",[52,242,243,246,251,253],{},[73,244,245],{},"Em dash",[73,247,248],{},[22,249,250],{},"—",[73,252,24],{},[73,254,255],{},"Interruptions: The result — surprising — was clear",[15,257,258],{},"The en dash is wider than a hyphen but narrower than an em dash. It connects spans of numbers, dates, and scores. The em dash sets off parenthetical thoughts or dramatic pauses.",[132,260,262],{"className":134,"code":261,"language":136,"meta":137,"style":137},"\u003Cp>The conference runs June 10–12 and features speakers from three continents—an unprecedented lineup.\u003C\u002Fp>\n",[22,263,264],{"__ignoreMap":137},[141,265,266,268,270,273,275,278,280,283,285],{"class":143,"line":144},[141,267,148],{"class":147},[141,269,15],{"class":151},[141,271,272],{"class":147},">The conference runs June 10",[141,274,234],{"class":157},[141,276,277],{"class":147},"12 and features speakers from three continents",[141,279,250],{"class":157},[141,281,282],{"class":147},"an unprecedented lineup.\u003C\u002F",[141,284,15],{"class":151},[141,286,175],{"class":147},[10,288,290],{"id":289},"spaces","Spaces",[15,292,293],{},"HTML collapses multiple spaces into one. Entity-based spaces give you precise control:",[46,295,296,310],{},[49,297,298],{},[52,299,300,302,305,308],{},[55,301,60],{},[55,303,304],{},"Name",[55,306,307],{},"Width",[55,309,66],{},[68,311,312,328,344,360],{},[52,313,314,319,322,325],{},[73,315,316],{},[22,317,318],{}," ",[73,320,321],{},"Non-breaking space",[73,323,324],{},"Same as space",[73,326,327],{},"Prevent line breaks between words",[52,329,330,335,338,341],{},[73,331,332],{},[22,333,334],{}," ",[73,336,337],{},"En space",[73,339,340],{},"Width of an \"n\"",[73,342,343],{},"Tabular alignment",[52,345,346,351,354,357],{},[73,347,348],{},[22,349,350],{}," ",[73,352,353],{},"Em space",[73,355,356],{},"Width of an \"m\"",[73,358,359],{},"Paragraph indentation",[52,361,362,367,370,373],{},[73,363,364],{},[22,365,366],{}," ",[73,368,369],{},"Thin space",[73,371,372],{},"Narrower than space",[73,374,375],{},"Thousand separators: 1 000",[15,377,378,379,382],{},"Non-breaking spaces are the most used — they prevent the browser from wrapping text at that point. Use them between a number and its unit (",[22,380,381],{},"10 kg",") or in navigation labels where a line break would look awkward.",[10,384,386],{"id":385},"currency-symbols","Currency Symbols",[46,388,389,401],{},[49,390,391],{},[52,392,393,396,398],{},[55,394,395],{},"Symbol",[55,397,60],{},[55,399,400],{},"Description",[68,402,403,415,428,441,454,467,480],{},[52,404,405,408,412],{},[73,406,407],{},"$",[73,409,410,219],{},[22,411,407],{},[73,413,414],{},"Dollar",[52,416,417,420,425],{},[73,418,419],{},"€",[73,421,422],{},[22,423,424],{},"€",[73,426,427],{},"Euro",[52,429,430,433,438],{},[73,431,432],{},"£",[73,434,435],{},[22,436,437],{},"£",[73,439,440],{},"Pound sterling",[52,442,443,446,451],{},[73,444,445],{},"¥",[73,447,448],{},[22,449,450],{},"¥",[73,452,453],{},"Yen \u002F Yuan",[52,455,456,459,464],{},[73,457,458],{},"¢",[73,460,461],{},[22,462,463],{},"¢",[73,465,466],{},"Cent",[52,468,469,472,477],{},[73,470,471],{},"₩",[73,473,474],{},[22,475,476],{},"₩",[73,478,479],{},"Won (numeric only)",[52,481,482,485,490],{},[73,483,484],{},"₹",[73,486,487],{},[22,488,489],{},"₹",[73,491,492],{},"Indian rupee (numeric only)",[15,494,495],{},"Not all currency symbols have named entities. For newer symbols like the Indian rupee (₹) or Bitcoin (₿), use numeric references.",[10,497,499],{"id":498},"mathematical-and-scientific-symbols","Mathematical and Scientific Symbols",[46,501,502,512],{},[49,503,504],{},[52,505,506,508,510],{},[55,507,395],{},[55,509,60],{},[55,511,400],{},[68,513,514,527,540,553,566,579,592,605,618,631],{},[52,515,516,519,524],{},[73,517,518],{},"±",[73,520,521],{},[22,522,523],{},"±",[73,525,526],{},"Plus-minus",[52,528,529,532,537],{},[73,530,531],{},"×",[73,533,534],{},[22,535,536],{},"×",[73,538,539],{},"Multiplication",[52,541,542,545,550],{},[73,543,544],{},"÷",[73,546,547],{},[22,548,549],{},"÷",[73,551,552],{},"Division",[52,554,555,558,563],{},[73,556,557],{},"≤",[73,559,560],{},[22,561,562],{},"≤",[73,564,565],{},"Less than or equal",[52,567,568,571,576],{},[73,569,570],{},"≥",[73,572,573],{},[22,574,575],{},"≥",[73,577,578],{},"Greater than or equal",[52,580,581,584,589],{},[73,582,583],{},"≠",[73,585,586],{},[22,587,588],{},"≠",[73,590,591],{},"Not equal",[52,593,594,597,602],{},[73,595,596],{},"≈",[73,598,599],{},[22,600,601],{},"≈",[73,603,604],{},"Approximately equal",[52,606,607,610,615],{},[73,608,609],{},"°",[73,611,612],{},[22,613,614],{},"°",[73,616,617],{},"Degree",[52,619,620,623,628],{},[73,621,622],{},"µ",[73,624,625],{},[22,626,627],{},"µ",[73,629,630],{},"Micro",[52,632,633,636,641],{},[73,634,635],{},"∞",[73,637,638],{},[22,639,640],{},"∞",[73,642,643],{},"Infinity",[10,645,647],{"id":646},"arrows-and-structural-symbols","Arrows and Structural Symbols",[46,649,650,660],{},[49,651,652],{},[52,653,654,656,658],{},[55,655,395],{},[55,657,60],{},[55,659,400],{},[68,661,662,675,688,701,714,727,740,753,766],{},[52,663,664,667,672],{},[73,665,666],{},"←",[73,668,669],{},[22,670,671],{},"←",[73,673,674],{},"Left arrow",[52,676,677,680,685],{},[73,678,679],{},"→",[73,681,682],{},[22,683,684],{},"→",[73,686,687],{},"Right arrow",[52,689,690,693,698],{},[73,691,692],{},"↑",[73,694,695],{},[22,696,697],{},"↑",[73,699,700],{},"Up arrow",[52,702,703,706,711],{},[73,704,705],{},"↓",[73,707,708],{},[22,709,710],{},"↓",[73,712,713],{},"Down arrow",[52,715,716,719,724],{},[73,717,718],{},"•",[73,720,721],{},[22,722,723],{},"•",[73,725,726],{},"Bullet",[52,728,729,732,737],{},[73,730,731],{},"§",[73,733,734],{},[22,735,736],{},"§",[73,738,739],{},"Section sign",[52,741,742,745,750],{},[73,743,744],{},"¶",[73,746,747],{},[22,748,749],{},"¶",[73,751,752],{},"Paragraph sign",[52,754,755,758,763],{},[73,756,757],{},"†",[73,759,760],{},[22,761,762],{},"†",[73,764,765],{},"Dagger",[52,767,768,771,776],{},[73,769,770],{},"‡",[73,772,773],{},[22,774,775],{},"‡",[73,777,778],{},"Double dagger",[10,780,782],{"id":781},"when-to-use-named-vs-numeric-entities","When to Use Named vs. Numeric Entities",[784,785,786,802,812],"ul",{},[787,788,789,793,794,796,797,796,799,801],"li",{},[790,791,792],"strong",{},"Named entities"," — Use for the common characters you type often: ",[22,795,250],{},", ",[22,798,318],{},[22,800,80],{},". They're readable and self-documenting.",[787,803,804,807,808,811],{},[790,805,806],{},"Decimal numeric"," — Use as a fallback when a named entity doesn't exist: ",[22,809,810],{},"…"," for an ellipsis.",[787,813,814,817,818,821],{},[790,815,816],{},"Hex numeric"," — Use when referencing Unicode charts: ",[22,819,820],{},"…"," for the same ellipsis. Hex matches Unicode notation, making cross-referencing easier.",[10,823,825],{"id":824},"key-takeaways","Key Takeaways",[784,827,828,831,840,846,849,852],{},[787,829,830],{},"Typography entities make content look professional — curly quotes, proper dashes, and correct spaces matter",[787,832,833,834,836,837,839],{},"Use ",[22,835,250],{}," for em dashes, ",[22,838,234],{}," for ranges, and hyphens only for compound words",[787,841,842,843,845],{},"Non-breaking spaces (",[22,844,318],{},") prevent awkward line breaks in numbers, units, and labels",[787,847,848],{},"Not all symbols have named entities — use numeric references for newer Unicode characters",[787,850,851],{},"Prefer named entities for readability; use numeric references when no name exists",[787,853,854],{},"Always test special characters across browsers and encodings to catch rendering issues",[10,856,858],{"id":857},"related-guides","Related Guides",[784,860,861,868,874],{},[787,862,863],{},[864,865,867],"a",{"href":866},"\u002Fguides\u002Fhtml-entities-guide","HTML Entities Guide",[787,869,870],{},[864,871,873],{"href":872},"\u002Fguides\u002Fhtml-special-characters-reference","HTML Special Characters Reference",[787,875,876],{},[864,877,879],{"href":878},"\u002Fguides\u002Fhtml-encoding-vs-url-encoding","HTML Encoding vs URL Encoding",[10,881,883],{"id":882},"try-it-yourself","Try It Yourself",[15,885,886,887,891],{},"Encode and decode HTML entities instantly with our free ",[864,888,890],{"href":889},"\u002Ftools\u002Fhtml-entity","HTML Entity Encoder\u002FDecoder",". Paste any text and get properly encoded output — including all typographic symbols.",[893,894,895],"style",{},"html pre.shiki code .sVt8B, html code.shiki .sVt8B{--shiki-default:#24292E;--shiki-dark:#E1E4E8}html pre.shiki code .s9eBZ, html code.shiki .s9eBZ{--shiki-default:#22863A;--shiki-dark:#85E89D}html pre.shiki code .sj4cs, html code.shiki .sj4cs{--shiki-default:#005CC5;--shiki-dark:#79B8FF}html pre.shiki code .sJ8bj, html code.shiki .sJ8bj{--shiki-default:#6A737D;--shiki-dark:#6A737D}html .default .shiki span {color: var(--shiki-default);background: var(--shiki-default-bg);font-style: var(--shiki-default-font-style);font-weight: var(--shiki-default-font-weight);text-decoration: var(--shiki-default-text-decoration);}html .shiki span {color: var(--shiki-default);background: var(--shiki-default-bg);font-style: var(--shiki-default-font-style);font-weight: var(--shiki-default-font-weight);text-decoration: var(--shiki-default-text-decoration);}html .dark .shiki span {color: var(--shiki-dark);background: var(--shiki-dark-bg);font-style: var(--shiki-dark-font-style);font-weight: var(--shiki-dark-font-weight);text-decoration: var(--shiki-dark-text-decoration);}html.dark .shiki span {color: var(--shiki-dark);background: var(--shiki-dark-bg);font-style: var(--shiki-dark-font-style);font-weight: var(--shiki-dark-font-weight);text-decoration: var(--shiki-dark-text-decoration);}",{"title":137,"searchDepth":178,"depth":178,"links":897},[898,899,900,901,902,903,904,905,906,907,908],{"id":12,"depth":178,"text":13},{"id":32,"depth":178,"text":33},{"id":188,"depth":178,"text":189},{"id":289,"depth":178,"text":290},{"id":385,"depth":178,"text":386},{"id":498,"depth":178,"text":499},{"id":646,"depth":178,"text":647},{"id":781,"depth":178,"text":782},{"id":824,"depth":178,"text":825},{"id":857,"depth":178,"text":858},{"id":882,"depth":178,"text":883},"2026-05-28","Master HTML entities for em dashes, quotes, currency symbols, and other typographic characters that improve web content.","md",{"immutable":913},true,"\u002Fguides\u002Fhtml-entities-typography-symbols",6,{"title":5,"description":910},"guides\u002Fhtml-entities-typography-symbols","vnfBtzi7mD_lrhskJHtJCLrQ3XJEBR6oMlptjQqACpw",1780401334366]