about:note fonts
Changes between (BrokenEagle98) and (BrokenEagle98)
The font of a translation note can be altered from the site default by using the CSS property [code]font-family[/code].¶
¶
h4. Usage¶
¶
Add the property name and desired font name to the [b]style[/b] attribute of the surrounding HTML block.¶
¶
* Example: [code]<span style="font-family:serif">This text will use a serif font</span>[/code]¶
¶
h4. Name specification¶
¶
Single word fonts can be used as is. Multiple word fonts usually must be surrounded by apostrophes.¶
¶
* Example: [code]<span style="font-family:'Times New Roman'">This text will use the Times New Roman font</span>[/code]¶
¶
h4. Generic fonts¶
¶
There are five generic fonts which are available on all systems. The browser will pick the first available preferred font available on the user's OS.¶
¶
The generic font names are:¶
¶
* serif¶
* sans-serif¶
* monospace¶
* cursive¶
* fantasy¶
¶
h4. Multiple fonts¶
¶
The [code]font-family[/code] property allows multiple fonts to be listed as fallback fonts. Each font name needs to be separated by a comma. The browser will use the first available font from among those listed.¶
¶
* Example: [code]<span style="font-family:'Times New Roman',serif">This text will use a font</span>[/code]¶
¶
In the above example, if Times New Roman is on the system, the browser will use that font. Otherwise it will pick its preferred serif font.¶
¶
[tn][b]Note:[/b] It is generally suggested to always end a font list with a generic font. Otherwise, the font used will be dependent upon the browser.[/tn]¶
¶
h4. Danbooru-supplied fonts¶
¶
Danbooru supplies a set list of fonts available to use which acts as a guarantee that that font will be available to use on every browser and OS.¶
¶
* [b]comic[/b] - "Comic Relief":[https://fontlibrary.org/en/font/comic-relief], a Comic Sans replacement.¶
* [b]narrow[/b] - "Archivo Narrow":[https://fonts.google.com/specimen/Archivo+Narrow], an Arial Narrow replacement. Narrow and thin.¶
* [b]mono[/b] - "IBM's Plex Mono":[https://fonts.google.com/specimen/IBM+Plex+Mono], a monospace font for use on code or robot-like text.¶
* [b]slab sans[/b] - "Anton":[https://fonts.google.com/specimen/Anton], an Impact replacement. Narrow and thick.¶
* [b]slab serif[/b] - "Rokkitt":[https://fonts.google.com/specimen/Rokkitt], a Rockwell replacement. A blocky serif font. Sometimes used for comic titles.¶
* [b]formal serif[/b] - "Lora":[https://fonts.google.com/specimen/Lora], a rounded, more formal serif font.¶
* [b]formal cursive[/b] - "Petit Formal Script":[https://fonts.google.com/specimen/Petit+Formal+Script], a fancy cursive font.¶
* [b]print[/b] - "Kalam":[https://fonts.google.com/specimen/Kalam], a neatly hand-printed font. Comparable to MV Boli. Suitable for neat handwriting or comics.¶
* [b]hand[/b] - "Indie Flower":[https://fonts.google.com/specimen/Indie+Flower], a more casual handwritten font. Comparable to Segoe Print.¶
* [b]childlike[/b] - "Giselle Script":[https://www.1001freefonts.com/gisele-script.font], a more-heavily stylized handwritten font. It has a lot of nice simple loops typical of what one might find in a children's course on teaching the alphabet.¶
* [b]blackletter[/b] - "Unifraktur Maguntia":[https://fonts.google.com/specimen/UnifrakturMaguntia], a Gothic / Germanic / Old English style font.¶
* [b]scary[/b] - "Anarchy":[https://www.dafont.com/anarchy-2.font], with jagged wild strokes.¶
¶
[tn][b]Note:[/b]The multiple word fonts that Danbooru provides do not need to be surrounded by apostrophes. Only the bolded font aliases will work, not the actual font names. For example, use [code]hand[/code], not [code]'Indie Flower'[/code].[/tn]¶
¶
Additionally, the following standard fonts have been aliased to other fonts:¶
¶
* [b]Comic Sans MS[/b] is now aliased to [b]Comic Relief[/b].¶
* [b]Arial Narrow[/b] is now aliased to [b]Archivo Narrow[/b].¶
* [b]Rockwell[/b] is now aliased to [b]Rokkitt[/b].¶
* [b]Impact[/b] is now aliased to [b]Anton[/b].¶
¶
[tn]Using specific fonts besides the Danbooru-supplied and generic font families is discouraged and support for them will be removed in the future.[/tn]¶
¶
h4. See also¶
¶
* topic #16435 - Discussion on Danbooru-supported fonts¶
* [[About:Note Formatting]]
¶
h4. Usage¶
¶
Add the property name and desired font name to the [b]style[/b] attribute of the surrounding HTML block.¶
¶
* Example: [code]<span style="font-family:serif">This text will use a serif font</span>[/code]¶
¶
h4. Name specification¶
¶
Single word fonts can be used as is. Multiple word fonts usually must be surrounded by apostrophes.¶
¶
* Example: [code]<span style="font-family:'Times New Roman'">This text will use the Times New Roman font</span>[/code]¶
¶
h4. Generic fonts¶
¶
There are five generic fonts which are available on all systems. The browser will pick the first available preferred font available on the user's OS.¶
¶
The generic font names are:¶
¶
* serif¶
* sans-serif¶
* monospace¶
* cursive¶
* fantasy¶
¶
h4. Multiple fonts¶
¶
The [code]font-family[/code] property allows multiple fonts to be listed as fallback fonts. Each font name needs to be separated by a comma. The browser will use the first available font from among those listed.¶
¶
* Example: [code]<span style="font-family:'Times New Roman',serif">This text will use a font</span>[/code]¶
¶
In the above example, if Times New Roman is on the system, the browser will use that font. Otherwise it will pick its preferred serif font.¶
¶
[tn][b]Note:[/b] It is generally suggested to always end a font list with a generic font. Otherwise, the font used will be dependent upon the browser.[/tn]¶
¶
h4. Danbooru-supplied fonts¶
¶
Danbooru supplies a set list of fonts available to use which acts as a guarantee that that font will be available to use on every browser and OS.¶
¶
* [b]comic[/b] - "Comic Relief":[https://fontlibrary.org/en/font/comic-relief], a Comic Sans replacement.¶
* [b]narrow[/b] - "Archivo Narrow":[https://fonts.google.com/specimen/Archivo+Narrow], an Arial Narrow replacement. Narrow and thin.¶
* [b]mono[/b] - "IBM's Plex Mono":[https://fonts.google.com/specimen/IBM+Plex+Mono], a monospace font for use on code or robot-like text.¶
* [b]slab sans[/b] - "Anton":[https://fonts.google.com/specimen/Anton], an Impact replacement. Narrow and thick.¶
* [b]slab serif[/b] - "Rokkitt":[https://fonts.google.com/specimen/Rokkitt], a Rockwell replacement. A blocky serif font. Sometimes used for comic titles.¶
* [b]formal serif[/b] - "Lora":[https://fonts.google.com/specimen/Lora], a rounded, more formal serif font.¶
* [b]formal cursive[/b] - "Petit Formal Script":[https://fonts.google.com/specimen/Petit+Formal+Script], a fancy cursive font.¶
* [b]print[/b] - "Kalam":[https://fonts.google.com/specimen/Kalam], a neatly hand-printed font. Comparable to MV Boli. Suitable for neat handwriting or comics.¶
* [b]hand[/b] - "Indie Flower":[https://fonts.google.com/specimen/Indie+Flower], a more casual handwritten font. Comparable to Segoe Print.¶
* [b]childlike[/b] - "Giselle Script":[https://www.1001freefonts.com/gisele-script.font], a more-heavily stylized handwritten font. It has a lot of nice simple loops typical of what one might find in a children's course on teaching the alphabet.¶
* [b]blackletter[/b] - "Unifraktur Maguntia":[https://fonts.google.com/specimen/UnifrakturMaguntia], a Gothic / Germanic / Old English style font.¶
* [b]scary[/b] - "Anarchy":[https://www.dafont.com/anarchy-2.font], with jagged wild strokes.¶
¶
[tn][b]Note:[/b]The multiple word fonts that Danbooru provides do not need to be surrounded by apostrophes. Only the bolded font aliases will work, not the actual font names. For example, use [code]hand[/code], not [code]'Indie Flower'[/code].[/tn]¶
¶
Additionally, the following standard fonts have been aliased to other fonts:¶
¶
* [b]Comic Sans MS[/b] is now aliased to [b]Comic Relief[/b].¶
* [b]Arial Narrow[/b] is now aliased to [b]Archivo Narrow[/b].¶
* [b]Rockwell[/b] is now aliased to [b]Rokkitt[/b].¶
* [b]Impact[/b] is now aliased to [b]Anton[/b].¶
¶
[tn]Using specific fonts besides the Danbooru-supplied and generic font families is discouraged and support for them will be removed in the future.[/tn]¶
¶
h4. See also¶
¶
* topic #16435 - Discussion on Danbooru-supported fonts¶
* [[About:Note Formatting]]