mirror of
https://github.com/penpot/penpot.git
synced 2025-01-09 08:20:45 -05:00
37 lines
2.7 KiB
Text
37 lines
2.7 KiB
Text
---
|
||
title: 16· Custom fonts
|
||
---
|
||
|
||
<h1 id="customfonts">Custom fonts</h1>
|
||
<p class="main-paragraph">If you have purchased, personal or libre fonts that are not included in the catalog provided by Penpot, you can upload them from your computer and use them across the files of a team. <p>
|
||
|
||
<h2 id="customfonts-upload">Upload local fonts</h2>
|
||
<p>To use a font that you have on your local machine, first you need to upload it to the Penpot team where you want to use it.</p>
|
||
<p>You can find the “Fonts” section in the dashboard menu, at the left sidebar.</p>
|
||
<p><a href="/img/customfonts.png" target="_blank"><img src="/img/customfonts.png" alt="local fonts" /></a></p>
|
||
|
||
<h3>To upload a local font:</h3>
|
||
<ol>
|
||
<li>Press “Add custom font”.</li>
|
||
<li>Inspect your local files to select one or more fonts that you want to upload. <strong>You can upload fonts with
|
||
the following formats: TTF, OTF and WOFF</strong>. Only one format will be needed.</li>
|
||
<li>Change the font name if needed. The font name is the name that will be shown in the font list at the workspace.
|
||
It is also what Penpot uses to group fonts in families. You can always edit it later.</li>
|
||
<li>Once ready, press upload. That's it. The font will be available at the font list of this team’s files.</li>
|
||
</ol>
|
||
<p><a href="/img/customfonts-upload.png" target="_blank"><img src="/img/customfonts-upload.png" alt="local fonts" /></a></p>
|
||
|
||
<h2 id="customfonts-families">Group fonts in font families</h2>
|
||
<p>Fonts with the same font family name will be grouped as a single font family. That means that at the font list that you will use at the files they will be shown as only one font with different variants available. </p>
|
||
<p>If you want to add a font variant (eg: Light) to a font family (eg: Helvetica) you only need to ensure during the upload process that it has the same font family name.</p>
|
||
<p><a href="/img/customfonts-families.png" target="_blank"><img src="/img/customfonts-families.png" alt="local fonts" /></a></p>
|
||
|
||
<h2 id="customfonts-edit">Edit custom fonts</h2>
|
||
<p>At the right side of a font family of the custom fonts list you can find a menu that allows you to edit the name of a font family and delete it.</p>
|
||
|
||
<h2 id="customfonts-using">Using custom fonts</h2>
|
||
<p>Custom fonts are added to the fonts catalog of a team and can be used at the workspace from the font list at the design sidebar.</p>
|
||
<p><img src="/img/customfonts-use.gif" alt="local fonts" /></p>
|
||
|
||
<h2>Fonts Licensing and Usage</h2>
|
||
<p>You should only upload fonts you own or have license to use in Penpot. Find out more in the Content rights section of <a href="https://penpot.app/terms" target="_blank">Penpot's Terms of Service</a>. You also might want to read about <a href="https://www.typography.com/faq" target="_blank">font licensing</a>.</p>
|