Not able to import Font Weights

[agoyal]

I’ve been trying to add multiple different fonts inside Penpot but when I do a bulk upload, the majority of my fonts are being clubbed together under a single Font Variant. When I do upload, I see only a single font family wit h no font-variant represented so I am losing out on different fonts.

A simple workaround is to upload fonts one by one but that’s tedious since I have close to 30 fonts! Curious to know thoughts and any other tips around these.

[carolina.portugal]

Hi @agoyal when you upload it should do it all. Can you confirm when you upload it that in your workspace you only see one weight?

[agoyal]

Hi @carolina.portugal - your understanding is correct. When I upload multiple font variants, I only see a single variant inside Penpot. Please refer to below screenshots:

View in Fonts:

View inside Penpot:

Is there anything that I might be doing wrong or does it seem like a bug?
Thanks so much.

[Alex]

@agoyal it could be a bug in the font files too, where are you getting them?, can we get them to to make some tests?

[Alex]

It’s probably related to your font files, I’ve tested with two files for the “Univers LT” and it worked:

You could also use a service like https://transfonter.org/ to fix the different font-weights and styles

[agoyal]

@Alex These are Adobe Fonts and come with our subscription to Creative Cloud, here is a direct link for them:

Adelle Sans | Adobe Fonts

I am also attaching the font files here to help you further troubleshoot:

Archive.zip

In the meantime, I’ll also check https://transfonter.org to see if that would work.

[Alex]

Thanks @agoyal

I tested uploading your font files and it worked

[agoyal]

That’s super weird @Alex , because I still get the same thing. Fonts are classified into a single variant and only appear once.

I had a few questions from the video you shared:

1. The drive link I shared was for Adelle, however, you have uploaded Univers LT Pro. Is there a specific place from which you downloaded these fonts?
2. I also used https://transfonter.org/ to merge different fonts inside a single font family and re-tried uploading but still no luck. Is there any other setting that I should change?

[Alex]

Ups!, sorry, I thought I was uploading the ones you sent but I used other fonts.

I think I found the problem if you use to https://fontdrop.info/ to read the font information you can see this:

For the Adelle Sans Cnd Thin:

And for the italic one:

They have the same fontFamily and fontSubfamilt attributes and should be different

[agoyal]

This is interesting, thanks for sharing it with me @Alex .
I checked out the link you shared for font for 2 specific fonts - both having different font families, check screenshot below:

However when I upload them inside Penpot both of them get clubbed together into 1:

This is definitely weird and I am curious to know your thoughts and a solution to this problem.

[Alex]

@agoyal could you please upload those two fonts (thin and ultra thin) somewhere?

I think the solution is fixing the fontSubfamily font attribute, it’s the one used to extract the weight/style

[agoyal]

Hey @Alex , I’ve seen cases where even if the fontFamily is same and fontSubFamily is different still those fonts are being clubbed into one. Specific details below:

Here you’ll find the link to both of these fonts:
https://drive.google.com/drive/folders/1RZw7v8rh04F_7agRkXKzcJ_4HL-qLZCL?usp=sharing

The fontFamily and subFamily as per my knowledge and the conversations we’ve had in this thread seems correct for both these fonts. Can you share insights / thoughts on this being a potential bug?

[agoyal]

Hey @Alex or @carolina.portugal - Looking forward to hearing back on this one.
Much appreciated!

[Alex]

Hey @agoyal !

I was checking the penpot code and arrived to this part, where it extracts the variant:

variant         (or (.getEnglishName ^js font "preferredSubfamily")
                                    (.getEnglishName ^js font "fontSubfamily"))

For this font those values are " 65 Bold" and “65 Bold Oblique”.

Then penpot uses that variant to try to parse font weight and style.

(defn parse-font-weight
  [variant]
  (cond
    (re-seq #"(?i)(?:hairline|thin)" variant)               100
    (re-seq #"(?i)(?:extra\s*light|ultra\s*light)" variant) 200
    (re-seq #"(?i)(?:light)" variant)                       300
    (re-seq #"(?i)(?:normal|regular)" variant)              400
    (re-seq #"(?i)(?:medium)" variant)                      500
    (re-seq #"(?i)(?:semi\s*bold|demi\s*bold)" variant)     600
    (re-seq #"(?i)(?:extra\s*bold|ultra\s*bold)" variant)   800
    (re-seq #"(?i)(?:bold)" variant)                        700
    (re-seq #"(?i)(?:extra\s*black|ultra\s*black)" variant) 950
    (re-seq #"(?i)(?:black|heavy|solid)" variant)           900
    :else                                                   400))

(defn parse-font-style
  [variant]
  (if (re-seq #"(?i)(?:italic)" variant)
    "italic"
    "normal"))

(defn font-weight->name
  [weight]
  (case weight
    100 "Hairline"
    200 "Extra Light"
    300 "Light"
    400 "Regular"
    500 "Medium"
    600 "Semi Bold"
    700 "Bold"
    800 "Extra Bold"
    900 "Black"
    950 "Extra Black"))

For “65 Bold” and “65 Bold Oblique” the part that fits for the weight is “bold” and “normal” for the style so they are clubbed together into 1.

[agoyal]

Thanks for the update @Alex!
There are cases in which fonts are “Bold Italics” and since we’ve hardcoded the font-weight names, this type of font would always get clubbed with either “Bold” or “Italics”. What is the best way to move forward in that case?
Are you guys also planning to add support for these kind of weights as well?

[eivind]

Bumping this issue. There seems to be a lack of granularity and flexibilty with font-weights when importing them, causing a lot of work to disccern them in a project. You have to upload each weight separately and give the unique names, because the weight is locked to “Regular” on each one.

Example: I have some fonts with custom weight names, like Wilco Loft Sans that uses weight-names in theme with the font. Treble, midrange, low end, bass. These need to be “translated” if imported into Penpot. I can use the fonts directly in both Affinity Designer 2 or Figma with the weight names correctly displayed, I guess it’s because it just reads them from the Font library on my machine.