robinwebdev
3/6/2018 - 8:46 AM

System font-family

How to use the font-family of the user system

.system-font-stack {
	font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen-Sans, Ubuntu, Cantarell, 'Helvetica Neue', Helvetica, Arial, sans-serif;
}


/*
	-apple-system                  is San Francisco, used on iOS and macOS (not Chrome however)
	BlinkMacSystemFont             is San Francisco, used on macOS Chrome
	Segoe UI                       is used on Windows 10
	Roboto                         is used on Android
	Oxygen-Sans                    is used on GNU+Linux
	Ubuntu                         is used on Linux
	"Helvetica Neue" and Helvetica are used on macOS 10.10 and below (wrapped in quotes because it has a space)
	Arial                          is a font widely supported by all operating systems
	sans-serif                     is the fallback sans-serif font if none of the other fonts are supported
*/