[{"data":1,"prerenderedAt":-1},["ShallowReactive",2],{"extension:v3:en:woff":3},{"resolvedFromAlias":4,"canonicalExt":5,"ext":5,"name":6,"category":7,"categoryName":8,"updatedAt":9,"popularity":10,"summary":11,"howToOs":12,"quickAnswer":18,"answerIntro":19,"whatIs":20,"description":21,"furtherReading":22,"openInstructions":38,"commonIssues":55,"securityNotes":74,"faq":78,"aliases":91,"mimeTypes":92,"relatedExtensions":94,"breadcrumbs":124,"categoryAnchor":134,"categoryFuturePath":135,"metaDescription":136,"availableHowToOs":137,"openOnDeviceLinks":138,"cannotOpenReasons":154,"cannotOpenFixes":155,"convertOptions":156,"securityAffiliateMessaging":157,"securityAffiliates":158},false,"woff","Web Open Font Format (WOFF)","fonts","Fonts","2026-06-12T08:27:26.177Z",72,".woff is a web font container format used by websites to deliver fonts efficiently to browsers. You typically “open” it by using it in CSS on a web page, or by inspecting/previewing it with font tools.",[13,14,15,16,17],"windows","mac","linux","ios","android","To open .WOFF files on Windows, for web use: put the .woff file in your project folder and reference it from CSS with @font-face (point src: url('yourfont.woff') format('woff')).","To open a .woff file, the most common approach is to use it as a web font in a browser via CSS (e.g., with @font-face). If you just want to view what it contains, use a font viewer/editor that can preview WOFF or inspect it through your browser’s developer tools.","WOFF (Web Open Font Format) is a compressed font file format designed primarily for use on the Web. It is a container for font data (commonly based on TrueType/OpenType outlines) packaged for efficient web delivery, as specified by the W3C WOFF 1.0 Recommendation. WOFF 2.0 is a newer, separate format with its own specification; .woff refers to WOFF 1.x, while .woff2 is used for WOFF 2.0.","WOFF was standardized by the W3C as a web-optimized way to distribute fonts, so browsers can download and use fonts on demand without requiring users to install them locally. In practice, .woff files are most often found inside website assets (for example, in a site’s /fonts/ folder) and referenced from CSS using @font-face.\n\nFrom a developer perspective, WOFF is less about “opening” a file in an app and more about serving it correctly over HTTP and referencing it properly in CSS so browsers can use it. Correct media type (MIME type) configuration can matter, and the standardized media type for WOFF is under the IETF/IANA “font” top-level type.\n\nIf you have a standalone .woff file, you can still inspect it: font tools may preview it, and web developers often verify it by loading it in a simple HTML page and checking in browser dev tools that the font downloads successfully and is applied to text.",[23,26,29,32,35],{"title":24,"url":25},"W3C Recommendation: WOFF File Format 1.0","https://www.w3.org/TR/WOFF/",{"title":27,"url":28},"W3C Recommendation: WOFF File Format 2.0","https://www.w3.org/TR/WOFF2/",{"title":30,"url":31},"RFC 8081: The \"font\" Top-Level Media Type","https://datatracker.ietf.org/doc/rfc8081/",{"title":33,"url":34},"IANA Media Types Registry (font/* entries including font/woff and deprecations)","https://www.iana.org/assignments/media-types",{"title":36,"url":37},"MDN: Web Open Font Format (WOFF) (CSS Guide)","https://developer.mozilla.org/en-US/docs/Web/CSS/Guides/Fonts/WOFF",{"windows":39,"macos":43,"linux":47,"ios":51,"android":53},[40,41,42],"For web use: put the .woff file in your project folder and reference it from CSS with @font-face (point src: url('yourfont.woff') format('woff')).","Open the HTML page in a modern browser to confirm the font loads and renders.","For inspection: use your browser’s Developer Tools (Network tab) to verify the .woff file is served and the correct type is applied.",[44,45,46],"For web use: add the .woff file to your site/project and reference it from CSS using @font-face (src: url('yourfont.woff') format('woff')).","Open the page in a modern browser and verify the font is applied.","If you need to debug loading, use browser Developer Tools to check the font request and response headers.",[48,49,50],"For web use: place the .woff in your project and reference it from CSS using @font-face with format('woff').","Load your page in a modern browser and confirm the font renders.","Use browser Developer Tools to troubleshoot if the font fails to download or apply.",[52],"Most iOS use cases involve .woff being loaded by a web page in the browser; to view it directly, open a page that references the font rather than trying to install it as a system font.",[54],"Most Android use cases involve .woff being loaded by a web page in the browser; for direct viewing, test it by referencing it in a simple web page and opening the page in a browser.",[56,62,68],{"title":57,"description":58,"steps":59},"Font doesn’t load on the website (wrong MIME type or server configuration)","Browsers expect web fonts to be served with an appropriate media type. If the server sends an incorrect type (or a deprecated one), the font may fail to load or be blocked by policies in some configurations.",[60,61],"Configure your web server to serve .woff with the standardized media type font/woff (per the IETF/IANA registration).","Re-test in the browser and confirm in Developer Tools that the response Content-Type is font/woff.",{"title":63,"description":64,"steps":65},"CSS @font-face reference is wrong (path/format mismatch)","A common practical issue is a broken URL path to the .woff file or an incorrect format() hint in @font-face, causing the browser to skip the source.",[66,67],"Verify the URL in src: url(...) points to the actual .woff location and that the file is accessible (no 404 in Network tab).","Use format('woff') for .woff sources and ensure the @font-face family name matches what you use in font-family.",{"title":69,"description":70,"steps":71},"Confusing .woff with .woff2",".woff and .woff2 are different formats with different specifications. Serving only one when the client expects the other can lead to missing fonts on some setups (especially when older assets or build pipelines are involved).",[72,73],"Confirm whether you have .woff (WOFF 1.x) or .woff2 (WOFF 2.0) files; don’t rename extensions to “convert.”","Provide the appropriate sources in @font-face (often listing both .woff2 and .woff, each with the correct format hint) if you need broader compatibility.",[75,76,77],"WOFF files are font resources, not scripts, but they are still binary files parsed by browsers and font libraries; malformed fonts can trigger parser vulnerabilities in consumers (browsers, rendering engines, or font tooling). Treat untrusted web font files as potentially risky inputs.","In web deployments, only load fonts you trust and serve them from controlled origins; review third-party font sources because they run through the browser’s font parsing and rendering pipeline.","Be careful with server configuration: serving the correct media type (font/woff) helps browsers handle the resource as a font; incorrect handling can cause failures or unexpected behavior.",[79,82,85,88],{"question":80,"answer":81},"What is a .woff file used for?","It’s a web font file used by websites so browsers can download and render custom fonts via CSS (commonly using @font-face).",{"question":83,"answer":84},"Is .woff the same as .woff2?","No. WOFF 1.x uses the .woff extension and is specified separately from WOFF 2.0, which uses .woff2.",{"question":86,"answer":87},"What MIME type should my server use for .woff?","The standardized media type is font/woff, defined under the IETF “font” top-level media type and listed in IANA’s media type registry.",{"question":89,"answer":90},"Can I install a .woff file like a normal desktop font?","WOFF is designed primarily for web use. Some tools can preview or convert fonts, but for general desktop installation workflows, traditional font formats are more commonly used.",[],[93],"font/woff",[95,101,107,112,118],{"ext":96,"name":97,"category":7,"categoryName":8,"popularity":98,"summary":99,"howToOs":100},"ttf","TrueType Font",85,".ttf is a TrueType font file used to install and use fonts in operating systems and applications. It may also be an OpenType font that uses TrueType outlines but is still stored with the .ttf extension.",[13,14,15,16,17],{"ext":102,"name":103,"category":7,"categoryName":8,"popularity":104,"summary":105,"howToOs":106},"otf","OpenType Font",75,".otf is an OpenType font file used by operating systems and applications to render text. You typically open it by installing the font or by viewing it in a font manager/editor.",[13,14,15,16,17],{"ext":108,"name":109,"category":7,"categoryName":8,"popularity":104,"summary":110,"howToOs":111},"woff2","WOFF2 Web Font",".woff2 is a WOFF2 (Web Open Font Format 2.0) file used to deliver compressed font data on the web. It’s most commonly “opened” by web browsers via CSS rather than installed like a desktop font.",[13,14,15,16,17],{"ext":113,"name":114,"category":7,"categoryName":8,"popularity":115,"summary":116,"howToOs":117},"gf","GF data",33,".gf files are TeX/METAFONT “generic font” bitmap output files, typically converted to .pk for use by DVI/TeX tools. You usually open them with TeX utilities like gftype or convert them with gftopk.",[13,14,15,16,17],{"ext":119,"name":120,"category":7,"categoryName":8,"popularity":121,"summary":122,"howToOs":123},"pk","PK data",30,".pk files are most commonly TeX Packed (PK) bitmap font files used by TeX/Metafont workflows. They are typically inspected or converted with TeX utilities such as pktype, gftopk, and pktogf rather than “opened” in a general-purpose app.",[13,14,15,16,17],[125,128,131],{"label":126,"to":127},"Home","/",{"label":129,"to":130},"File Extension Index","/file-extension",{"label":132,"to":133},".WOFF","/file-extension/woff","category-fonts","/category/fonts","Learn what .WOFF files are, how to open them on every platform, common fixes, and security best practices.",[13,14,15,16,17],[139,142,145,148,151],{"os":13,"label":140,"to":141},"Open .WOFF on Windows","/how-to/open-woff-on-windows",{"os":14,"label":143,"to":144},"Open .WOFF on Mac","/how-to/open-woff-on-mac",{"os":15,"label":146,"to":147},"Open .WOFF on Linux","/how-to/open-woff-on-linux",{"os":16,"label":149,"to":150},"Open .WOFF on iOS","/how-to/open-woff-on-ios",{"os":17,"label":152,"to":153},"Open .WOFF on Android","/how-to/open-woff-on-android",[57,63,69],[60,61],[],"untrusted_source",[159,163],{"name":160,"description":161,"affiliateUrl":162},"Avast","Avast offers free and premium antivirus software that protects against viruses, malware, ransomware, and phishing. Scan files before opening them to ensure safety.","https://www.avast.com/lp-aff-consumer-store?expid=inf601",{"name":164,"description":165,"affiliateUrl":166},"Norton","Norton 360 delivers comprehensive antivirus protection, VPN, and identity theft monitoring. Scan files for threats before opening to keep your device secure.","http://buy.norton.com/aff_home?utm_campaign=en-ww_nor_n36_aff_nas_nau_nah_cj_nad_low:_sec_nat_mktc_norton_360"]