question-mark
Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

support fvar/avar userspace in variable font?

See original GitHub issue

hi! first of all I am loving this library so much. THANK YOU.

RE: the subject. I am trying to figure out if this is a design decision, a TODO, or something wrong with my font! couldn’t find much in the docs. but it seems I can only access, for example, a wght axis from 0.0 to 1.0 (would expect 0-1000 for weight), and also whereas I might have an avar table with fvar (userspace) values like 100, 200, … , 900 which is what I’d expect to be able to use. (e.g.: https://simoncozens.github.io/userspace-and-designspace/)

Issue Analytics

  • State:closed
  • Created 2 years ago
  • Comments:5

github_iconTop GitHub Comments

1reaction
jptcommented, Aug 28, 2021

Thanks for the tip on scaleVariations! I can see for the purpose of animation in particular, that normalizing everything between extremes at 0-1 is helpful, though. There’s a lot to think about RE: how people will want to use those values, ultimately. I personally like your dead-simple solution to this even if it isn’t in keeping with OT spec. have been having a blast with coldtype!

Barlow is not a good example for this as it ignores userspace entirely 😅 one day!

0reactions
jptcommented, Aug 29, 2021

@stenson just to better illustrate this in python form in case it’s helpful (and really only thinking about the weight axis here), this is pretty much the problem I was working though. I provide a userspace value like 400 (which I know is regular weight), I get 0.3505 in return to provide to coldtype

def precise(number,precision=4):
	return float(f'{number:.{precision}f}')

def transformToRange(c,d,arr):
	values = []
	a = arr[0]
	b = arr[len(arr)-1]

	def affine(x,a,b,c,d):
		return (x-a)*((d-c)/(b-a))+c
		
	for x in range(0,len(arr)):
		values.append(precise(affine(arr[x],a,b,c,d)))
	return values

designspaceCoords = [18,38,62,86,104,130,152,180,212] # internal coordinates based on stem width - a pretty common type design pattern
userspaceCoords = [100,200,300,400,500,600,700,800,900] # maps to CSS values, also pretty common

def getzeroOneSpaceByUserCoord(userCoord):
    zeroOneSteps = transformToRange(0,1,designspaceCoords) 
    for i,coord in enumerate(userspaceCoords):
        if coord == userCoord:
            return zeroOneSteps[i]

print(getzeroOneSpaceByUserCoord(400))

of course, userspace inputs can be arbitrary, so it’s a bit more complicated, but suits my use case for the moment anyway 😃

looking forward to digging more into the rng and scaleVariations example you provided.

I really cannot stress enough how awesome coldtype is!

Read more comments on GitHub >

github_iconTop Results From Across the Web

Variable fonts | Can I use... Support tables for HTML5, CSS3, etc
OpenType font settings that allows a single font file to behave like multiple fonts: it can contain all the allowed variations in width,...
Read more >
Variable fonts guide - CSS: Cascading Style Sheets | MDN
Variable font support can be checked with CSS Feature Queries (see @supports ), so it's possible to use variable fonts in production and...
Read more >
Introduction to variable fonts on the web
In this article, we will look at what variable fonts are, the benefits they offer, and how we can use them in our...
Read more >
Support - Variable Fonts
This table lists support for variable fonts in various operating systems, browsers, and other software, with links to original source ...
Read more >
Userspace and designspace - a note to self
Whenever I play with (or make) variable fonts, I get hopelessly confused about the difference between userspace and designspace coordinates.
Read more >

github_iconTop Related Medium Post

No results found

github_iconTop Related StackOverflow Question

No results found

github_iconTroubleshoot Live Code

Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free

github_iconTop Related Reddit Thread

No results found

github_iconTop Related Hackernoon Post

No results found

github_iconTop Related Tweet

No results found

github_iconTop Related Dev.to Post

No results found

github_iconTop Related Hashnode Post

No results found