CSS font-feature-settings
CSS font-feature-settings
Method of applying advanced typographic and language-specific font features to supported OpenType fonts.
| Spec | http://w3.org/TR/css3-fonts/#font-rend-props |
|---|---|
| Status | W3C Candidate Recommendation |
| IE | Edge | Firefox | Chrome | Safari | Opera |
|---|---|---|---|---|---|
| 57 | 62 | ||||
| 56 | 61 | TP | 48 | ||
| 16 | 55 | 60 | 11 | 47 | |
| 11 | 15 | 54 | 59 | 10.1 | 46 |
| 10 | 14 | 53 | 58 | 10 | 45 |
| 9 | 13 | 52 | 57 | 9.1 | 44 |
| 8 | 12 | 51 | 56 | 9 | 43 |
| Show all | |||||
| 7 | 50 | 55 | 8 | 42 | |
| 6 | 49 | 54 | 7.1 | 41 | |
| 5.5 | 48 | 53 | 7 | 40 | |
| 47 | 52 | 6.1 | 39 | ||
| 46 | 51 | 6 | 38 | ||
| 45 | 50 | 5.1 | 37 | ||
| 44 | 49 | 5 | 36 | ||
| 43 | 48 | 4 | 35 | ||
| 42 | 47 (*) | 3.2 | 34 (*) | ||
| 41 | 46 (*) | 3.1 | 33 (*) | ||
| 40 | 45 (*) | 32 (*) | |||
| 39 | 44 (*) | 31 (*) | |||
| 38 | 43 (*) | 30 (*) | |||
| 37 | 42 (*) | 29 (*) | |||
| 36 | 41 (*) | 28 (*) | |||
| 35 | 40 (*) | 27 (*) | |||
| 34 | 39 (*) | 26 (*) | |||
| 33 (*) | 38 (*) | 25 (*) | |||
| 32 (*) | 37 (*) | 24 (*) | |||
| 31 (*) | 36 (*) | 23 (*) | |||
| 30 (*) | 35 (*) | 22 (*) | |||
| 29 (*) | 34 (*) | 21 (*) | |||
| 28 (*) | 33 (*) | 20 (*) | |||
| 27 (*) | 32 (*) | 19 (*) | |||
| 26 (*) | 31 (*) | 18 (*) | |||
| 25 (*) | 30 (*) | 17 (*) | |||
| 24 (*) | 29 (*) | 16 (*) | |||
| 23 (*) | 28 (*) | 15 (*) | |||
| 22 (*) | 27 (*) | 12.1 | |||
| 21 (*) | 26 (*) | 12 | |||
| 20 (*) | 25 (*) | 11.6 | |||
| 19 (*) | 24 (*) | 11.5 | |||
| 18 (*) | 23 (*) | 11.1 | |||
| 17 (*) | 22 (*) | 11 | |||
| 16 (*) | 21 (*) | 10.6 | |||
| 15 (*) | 20 (2,*) | 10.5 | |||
| 14 (1,*) | 19 (2,*) | 10.0-10.1 | |||
| 13 (1,*) | 18 (2,*) | 9.5-9.6 | |||
| 12 (1,*) | 17 (2,*) | 9 | |||
| 11 (1,*) | 16 (2,*) | ||||
| 10 (1,*) | 15 | ||||
| 9 (1,*) | 14 | ||||
| 8 (1,*) | 13 | ||||
| 7 (1,*) | 12 | ||||
| 6 (1,*) | 11 | ||||
| 5 (1,*) | 10 | ||||
| 4 (1,*) | 9 | ||||
| 3.6 | 8 | ||||
| 3.5 | 7 | ||||
| 3 | 6 | ||||
| 2 | 5 | ||||
| 4 | |||||
| iOS Safari | Opera Mini | Android Browser | Blackberry Browser | Opera Mobile | Android Chrome | Android Firefox | IE Mobile | Android UC Browser | Samsung Internet | QQ Browser | Baidu Browser |
|---|---|---|---|---|---|---|---|---|---|---|---|
| 11 | |||||||||||
| 10.3 | all | 56 | 10 (*) | 37 | 59 | 54 | 11 | 11.4 (*) | 5 | 1.2 | 7.12 |
| 10.0-10.2 | 4.4.3-4.4.4 (*) | 7 | 12.1 | 10 | 4 (*) | ||||||
| 9.3 | 4.4 (*) | 12 | |||||||||
| 9.0-9.2 | 4.2-4.3 | 11.5 | |||||||||
| Show all | |||||||||||
| 8.1-8.4 | 4.1 | 11.1 | |||||||||
| 8 | 4 | 11 | |||||||||
| 7.0-7.1 | 3 | 10 | |||||||||
| 6.0-6.1 | 2.3 | ||||||||||
| 5.0-5.1 | 2.2 | ||||||||||
| 4.2-4.3 | 2.1 | ||||||||||
| 4.0-4.1 | |||||||||||
| 3.2 | |||||||||||
Notes
Whenever possible, font-variant shorthand property or an associated longhand property, font-variant-ligatures, font-variant-caps, font-variant-east-asian, font-variant-alternates, font-variant-numeric or font-variant-position should be used. This property is a low-level feature designed to handle special cases where no other way to enable or access an OpenType font feature exists. In particular, this CSS property shouldn't be used to enable small caps.
From Gecko 2.0 (Firefox 4.0) to Gecko 14.0 (Firefox 14.0) included, Gecko supported an older syntax, slightly different from the modern one: http://hacks.mozilla.org/2010/11/firefox-4-font-feature-support/
Partial support in older Chrome versions refers to lacking support in Mac OS X.
- * Partial support with prefix.
Bugs
IE10 and 11 do not always appear to support the
ss01value correctly.IE10 and 11 on Windows 7 can hide the text under certain circumstances.
Resources
- Demo pages (IE/Firefox only)
- Mozilla hacks article
- Detailed tables on accessability support
- WebPlatform Docs
- Mozilla Developer Network (MDN) documentation - font-feature-settings
- OpenType layout feature tag registry
- Syntax for OpenType features in CSS (Adobe Typekit Help)
Data by caniuse.com
Licensed under the Creative Commons Attribution License v4.0.
http://caniuse.com/#feat=font-feature
