Are eot, ttf, and svg still necessary in the font-face declaration?

06/20/2022 Update

My answer is now no longer truly relevant, unless you're working on some really specific use-case where you know truly antiquated browsers that should not be used anymore are still being used anyway (government work?). Keeping this here for posterity, but IE is now finally dead, at least for modern commercial applications.

(edited to move this to the top)

This is more of a 2019 addendum. At this point 09/18/2019, there is still substantial use of IE11, not to mention other more obsolete software.

As such, the accepted top voted answer is wrong in it's most recent edit from a year ago no less, that you only need woff2. At the very least you need both woff2 and woff, and you may want a more universal backup option even if it's less than ideal like svg.

While certainly you should first start by loading and supporting woff2 primarily, legacy support is just a fact of life and you probably will not be able to get away with only woff2 for several more years in any professional endeavor.

The most comprehensive modern option is likely woff2, woff as a fallback, and eot for IE. This hits all browsers in any significant use in 2019/2020

Example:

@font-face {
  font-family: "yourFontHere";
  font-style: normal;
  font-weight: 400;
  font-display: block;
  src: url("../fonts/yourFontHere.eot");
  src: url("../fonts/yourFontHere.eot?#iefix") format("ie9-skip-eot"),
  url("../fonts/yourFontHere.woff2") format("woff2"),
  url("../fonts/yourFontHere.woff") format("woff");
}

This is what a normal comprehensive font face declaration looks like.

See the following:Eot, Woff, Woff2

This covers everything except for Opera Mini, which frankly is less worth supporting than IE 6-8 due to being both a nightmare to support, and seeing very little usage.

However if you disagree with this assessment you can add an additional fallback line as needed just like the woff line. adding svg format to the example above will not only support all browsers, but there's also an argument to be made for including it for accessibility purposes. See here: Accessibility example

I decided to post my own answer to this for two reasons: the currently accepted answer is slightly overzealous about using the WOFF2 and WOFF font stack in modern web dev without mention of other factors, and it also points heavily to official end-of-life dates, which don't reflect what browser versions are actually being used in the real world. In this answer I'll be sourcing CanIUse.com, which is an industry standard for keeping track of things like this.

Support for WOFF2

WOFF2 improves on WOFF in every way, is supported by most desktop browsers released after 2014, but has only since 2018 began to be supported by most mobile browsers. It's supported by an estimated 93% of browsers globally.

Support for WOFF

WOFF began to be supported by Internet Explorer in IE9 (released in 2011), which renders the EOT format obsolete for versions of IE released since 2011. It's supported by an estimated 97% of browsers globally.

Other desktop browsers began to support WOFF at roughly the same time, including Firefox since Firefox 3.6, Chrome since Chrome 5, and Safari since 5.1 (released in 2010, 2011 and 2011 respectively), rendering the TTF and OTF¹ formats obsolete in prior versions. Most mobile browsers have supported WOFF since 2013.

Caveat and Conclusions

From this standpoint, it's easy enough to write off all other formats as being unnecessary, but software no longer officially being supported has never been a good indicator that it's no longer being used. To put it another way, global browser version share is not guaranteed at all to be representative of the demographics that your website will be used by.

Browser version share can vary dramatically among demographics: factors like country, social class, and income all heavily influence what devices (and therefore, versions of browsers) your users are using. As a developer, think about whether the site you're building will be used by demographics that are more likely to be using those older versions.

If you decide that that's the case, and you need to support desktop browsers older than 2011, or mobile browsers older than 2013, use the full font stack: WOFF2, WOFF, TTF (or OTF), and EOT.

If you don't need to support those ancient browsers, and it's still true that you more than likely don't, simply use WOFF2 and WOFF as your font stack from hereon.

_{(1) TTF and OTF are traditional desktop font formats, and any browser that supports one supports the other, so never use both}