From: Elliot Jay Stocks Date: Thu, 16 May 2024 17:31:49 +0000 (+0100) Subject: Fixing thumbnails for GFK 2024 additions (#7662) X-Git-Url: http://git.ipfire.org/cgi-bin/gitweb.cgi?a=commitdiff_plain;h=a7acaaa8144407313f7b78e754924b995f152d1b;p=thirdparty%2Fgoogle%2Ffonts.git Fixing thumbnails for GFK 2024 additions (#7662) * SVG (not PNG) `thumbnail` images for edpt + ehlt * Revert "Remove glossary term `ehlt_axis` (#7606)" This reverts commit a0888504d7c2812347983d9b1bde36d96dc953e2. * Revert "Remove glossary term `edpt_axis` (#7605)" This reverts commit 654167bd4bc35ac3c553f41a1cc70396292dc0bc. --------- Co-authored-by: nathan-williams --- diff --git a/cc-by-sa/knowledge/glossary/terms/edpt_axis/content.md b/cc-by-sa/knowledge/glossary/terms/edpt_axis/content.md new file mode 100644 index 0000000000..4ce794e32f --- /dev/null +++ b/cc-by-sa/knowledge/glossary/terms/edpt_axis/content.md @@ -0,0 +1,20 @@ + +“Extrusion Depth” (`EDPT` in CSS) is an [axis](/glossary/axis_in_variable_fonts) found in some [variable fonts](/glossary/variable_fonts) that can be used to control the depth of three-dimensional letterforms. Values are in thousandths of an [em](/glossary/em) (the current font size). For example, setting Extrusion Depth to 500 will result in a 50%-of-the-em extrusion, which would be 20 px if the font size is set to 40 px. + +The [Google Fonts CSS v2 API](https://developers.google.com/fonts/docs/css2) defines the axis as: + +| Default: | Min: | Max: | Step: | +| --- | --- | --- | --- | +| 100 | 0 | 1000 | 1 + +Note that the default value is expected to differ per family, rather than be universally set for any implementation of this axis. + +
+ +![An image showing two type specimens, each with an axis slider underneath. The specimen on the left shows the effects of the axis’ lowest value. The specimen on the right shows the effects of the axis’ highest value.](images/thumbnail.svg) + +
+ +
Note the two-dimensional appearance when the axis is set to 0 when using the [Nabla font](https://fonts.google.com/specimen/Nabla).
+ +The axis was first used in the [Nabla font](https://fonts.google.com/specimen/Nabla) [color font](/glossary/color_fonts), which uses isometric perspective to achieve its three-dimensional look. The extrusion depth, at its maximum setting, creates a deeper or thicker letterform. At its minimum setting, the letterform appears only two-dimensional. \ No newline at end of file diff --git a/cc-by-sa/knowledge/glossary/terms/edpt_axis/images/thumbnail.svg b/cc-by-sa/knowledge/glossary/terms/edpt_axis/images/thumbnail.svg new file mode 100644 index 0000000000..c700b640a9 --- /dev/null +++ b/cc-by-sa/knowledge/glossary/terms/edpt_axis/images/thumbnail.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/cc-by-sa/knowledge/glossary/terms/edpt_axis/term.textproto b/cc-by-sa/knowledge/glossary/terms/edpt_axis/term.textproto new file mode 100644 index 0000000000..4727ccd58e --- /dev/null +++ b/cc-by-sa/knowledge/glossary/terms/edpt_axis/term.textproto @@ -0,0 +1,5 @@ +name: "Extrusion Depth axis (EDPT)" +excerpt: "An axis found in some variable fonts that can be used to control the depth of three-dimensional letterforms." +related_lessons: "introducing_variable_fonts" +related_lessons: "designing_with_variable_fonts_in_desktop_apps" +related_lessons: "styling_type_on_the_web_with_variable_fonts" diff --git a/cc-by-sa/knowledge/glossary/terms/ehlt_axis/content.md b/cc-by-sa/knowledge/glossary/terms/ehlt_axis/content.md new file mode 100644 index 0000000000..a0f1820c7f --- /dev/null +++ b/cc-by-sa/knowledge/glossary/terms/ehlt_axis/content.md @@ -0,0 +1,20 @@ + +“Edge Highlight” (`EHLT` in CSS) is an [axis](/glossary/axis_in_variable_fonts) found in some [variable fonts](/glossary/variable_fonts) that can be used to control the thickness of the highlighted part of edges in three-dimensional [letterforms](/glossary/letterform). Values are in thousandths of an [em](/glossary/em) (at the current font size). For example, setting Extrusion Depth to 500 will result in a 50%-of-the-em extrusion, which would be 20 px if the font size is set to 40 px. + +The [Google Fonts CSS v2 API](https://developers.google.com/fonts/docs/css2) defines the axis as: + +| Default: | Min: | Max: | Step: | +| --- | --- | --- | --- | +| 12 | 0 | 1000 | 1 | + +Note that the default value is expected to differ per family, rather than be universally set for any implementation of this axis. + +
+ +![An image showing three type specimens, each with an axis slider underneath. The specimen on the left shows the effects of the axis’ lowest value. The specimen on the right shows the effects of the axis’ highest value.](images/thumbnail.svg) + +
+ +
Note the total lack of an edge when the axis is set to 0 when using the [Nabla font](https://fonts.google.com/specimen/Nabla).
+ +The axis was first used in the [Nabla font](https://fonts.google.com/specimen/Nabla) [color font](/glossary/color_fonts), which uses isometric perspective to achieve its three-dimensional look. The highlighted edge, at its maximum setting, creates greater contrast between the face of the letterform and its extrusion. And, like all components of a color font, can be recolored from its white default. \ No newline at end of file diff --git a/cc-by-sa/knowledge/glossary/terms/ehlt_axis/images/thumbnail.svg b/cc-by-sa/knowledge/glossary/terms/ehlt_axis/images/thumbnail.svg new file mode 100644 index 0000000000..40935cda7e --- /dev/null +++ b/cc-by-sa/knowledge/glossary/terms/ehlt_axis/images/thumbnail.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/cc-by-sa/knowledge/glossary/terms/ehlt_axis/term.textproto b/cc-by-sa/knowledge/glossary/terms/ehlt_axis/term.textproto new file mode 100644 index 0000000000..8016e3bb35 --- /dev/null +++ b/cc-by-sa/knowledge/glossary/terms/ehlt_axis/term.textproto @@ -0,0 +1,5 @@ +name: "Edge Highlight axis (EHLT)" +excerpt: "An axis found in some variable fonts that can be used to control the thickness of the highlighted part of edges in three-dimensional letterforms." +related_lessons: "introducing_variable_fonts" +related_lessons: "designing_with_variable_fonts_in_desktop_apps" +related_lessons: "styling_type_on_the_web_with_variable_fonts"