Inter font not displaying correctly

[autumnfjeld]

See p1693920223751639-slack-C048CUFRGFQ

Current Experience

Inter font not loading

Expected

Font should look like https://fonts.google.com/specimen/Inter

cc: @Automattic/lego

[miksansegundo]

This issue affects the assembler. The solution seems simple but I don't know where to make the change. @Automattic/lego

Google Fonts API returns the HTTP error 400 Missing family name 'Albert Sans' because of the font names contain single quotes. We just have to remove them to fix it.

After I remove all the single quotes %27 the request works.

Click to see it working: https://fonts-api.wp.com/css2?family=Inter%3Aital%2Cwght%400%2C400%3B0%2C700%3B1%2C400%3B1%2C700&family=Literata+60pt%3Aital%2Cwght%400%2C400%3B0%2C700%3B1%2C400%3B1%2C700&family=Literata%3Aital%2Cwght%400%2C400%3B0%2C700%3B1%2C400%3B1%2C700&family=Albert+Sans%3Aital%2Cwght%400%2C400%3B0%2C700%3B1%2C400%3B1%2C700&family=Alegreya%3Aital%2Cwght%400%2C400%3B0%2C700%3B1%2C400%3B1%2C700&family=Arvo%3Aital%2Cwght%400%2C400%3B0%2C700%3B1%2C400%3B1%2C700&family=Bodoni+Moda%3Aital%2Cwght%400%2C400%3B0%2C700%3B1%2C400%3B1%2C700&family=Cabin%3Aital%2Cwght%400%2C400%3B0%2C700%3B1%2C400%3B1%2C700&family=Chivo%3Aital%2Cwght%400%2C400%3B0%2C700%3B1%2C400%3B1%2C700&family=Commissioner%3Aital%2Cwght%400%2C400%3B0%2C700%3B1%2C400%3B1%2C700&family=Cormorant%3Aital%2Cwght%400%2C400%3B0%2C700%3B1%2C400%3B1%2C700&family=Courier+Prime%3Aital%2Cwght%400%2C400%3B0%2C700%3B1%2C400%3B1%2C700&family=Crimson+Pro%3Aital%2Cwght%400%2C400%3B0%2C700%3B1%2C400%3B1%2C700&family=DM+Mono%3Aital%2Cwght%400%2C400%3B0%2C700%3B1%2C400%3B1%2C700&family=DM+Sans%3Aital%2Cwght%400%2C400%3B0%2C700%3B1%2C400%3B1%2C700&family=Domine%3Aital%2Cwght%400%2C400%3B0%2C700%3B1%2C400%3B1%2C700&family=EB+Garamond%3Aital%2Cwght%400%2C400%3B0%2C700%3B1%2C400%3B1%2C700&family=Epilogue%3Aital%2Cwght%400%2C400%3B0%2C700%3B1%2C400%3B1%2C700&family=Figtree%3Aital%2Cwght%400%2C400%3B0%2C700%3B1%2C400%3B1%2C700&family=Fira+Sans%3Aital%2Cwght%400%2C400%3B0%2C700%3B1%2C400%3B1%2C700&family=Fraunces%3Aital%2Cwght%400%2C400%3B0%2C700%3B1%2C400%3B1%2C700&family=IBM+Plex+Mono%3Aital%2Cwght%400%2C400%3B0%2C700%3B1%2C400%3B1%2C700&family=IBM+Plex+Sans%3Aital%2Cwght%400%2C400%3B0%2C700%3B1%2C400%3B1%2C700&family=Josefin+Sans%3Aital%2Cwght%400%2C400%3B0%2C700%3B1%2C400%3B1%2C700&family=Jost%3Aital%2Cwght%400%2C400%3B0%2C700%3B1%2C400%3B1%2C700&family=Libre+Baskerville%3Aital%2Cwght%400%2C400%3B0%2C700%3B1%2C400%3B1%2C700&family=Libre+Franklin%3Aital%2Cwght%400%2C400%3B0%2C700%3B1%2C400%3B1%2C700&family=Lora%3Aital%2Cwght%400%2C400%3B0%2C700%3B1%2C400%3B1%2C700&family=Merriweather%3Aital%2Cwght%400%2C400%3B0%2C700%3B1%2C400%3B1%2C700&family=Montserrat%3Aital%2Cwght%400%2C400%3B0%2C700%3B1%2C400%3B1%2C700&family=Newsreader%3Aital%2Cwght%400%2C400%3B0%2C700%3B1%2C400%3B1%2C700&family=Nunito%3Aital%2Cwght%400%2C400%3B0%2C700%3B1%2C400%3B1%2C700&family=Open+Sans%3Aital%2Cwght%400%2C400%3B0%2C700%3B1%2C400%3B1%2C700&family=Overpass%3Aital%2Cwght%400%2C400%3B0%2C700%3B1%2C400%3B1%2C700&family=Petrona%3Aital%2Cwght%400%2C400%3B0%2C700%3B1%2C400%3B1%2C700&family=Piazzolla%3Aital%2Cwght%400%2C400%3B0%2C700%3B1%2C400%3B1%2C700&family=Playfair+Display%3Aital%2Cwght%400%2C400%3B0%2C700%3B1%2C400%3B1%2C700&family=Plus+Jakarta+Sans%3Aital%2Cwght%400%2C400%3B0%2C700%3B1%2C400%3B1%2C700&family=Poppins%3Aital%2Cwght%400%2C400%3B0%2C700%3B1%2C400%3B1%2C700&family=Raleway%3Aital%2Cwght%400%2C400%3B0%2C700%3B1%2C400%3B1%2C700&family=Roboto+Slab%3Aital%2Cwght%400%2C400%3B0%2C700%3B1%2C400%3B1%2C700&family=Roboto%3Aital%2Cwght%400%2C400%3B0%2C700%3B1%2C400%3B1%2C700&family=Rubik%3Aital%2Cwght%400%2C400%3B0%2C700%3B1%2C400%3B1%2C700&family=Sora%3Aital%2Cwght%400%2C400%3B0%2C700%3B1%2C400%3B1%2C700&family=Source+Sans+Pro%3Aital%2Cwght%400%2C400%3B0%2C700%3B1%2C400%3B1%2C700&family=Source+Serif+Pro%3Aital%2Cwght%400%2C400%3B0%2C700%3B1%2C400%3B1%2C700&family=Space+Mono%3Aital%2Cwght%400%2C400%3B0%2C700%3B1%2C400%3B1%2C700&family=Texturina%3Aital%2Cwght%400%2C400%3B0%2C700%3B1%2C400%3B1%2C700&family=Work+Sans%3Aital%2Cwght%400%2C400%3B0%2C700%3B1%2C400%3B1%2C700&display=swap

Click to see the error: https://fonts-api.wp.com/css2?family=Inter%3Aital%2Cwght%400%2C400%3B0%2C700%3B1%2C400%3B1%2C700&family=Literata+60pt%3Aital%2Cwght%400%2C400%3B0%2C700%3B1%2C400%3B1%2C700&family=Literata%3Aital%2Cwght%400%2C400%3B0%2C700%3B1%2C400%3B1%2C700&family=%27Albert+Sans%27%3Aital%2Cwght%400%2C400%3B0%2C700%3B1%2C400%3B1%2C700&family=Alegreya%3Aital%2Cwght%400%2C400%3B0%2C700%3B1%2C400%3B1%2C700&family=Arvo%3Aital%2Cwght%400%2C400%3B0%2C700%3B1%2C400%3B1%2C700&family=%27Bodoni+Moda%27%3Aital%2Cwght%400%2C400%3B0%2C700%3B1%2C400%3B1%2C700&family=Cabin%3Aital%2Cwght%400%2C400%3B0%2C700%3B1%2C400%3B1%2C700&family=Chivo%3Aital%2Cwght%400%2C400%3B0%2C700%3B1%2C400%3B1%2C700&family=Commissioner%3Aital%2Cwght%400%2C400%3B0%2C700%3B1%2C400%3B1%2C700&family=Cormorant%3Aital%2Cwght%400%2C400%3B0%2C700%3B1%2C400%3B1%2C700&family=%27Courier+Prime%27%3Aital%2Cwght%400%2C400%3B0%2C700%3B1%2C400%3B1%2C700&family=%27Crimson+Pro%27%3Aital%2Cwght%400%2C400%3B0%2C700%3B1%2C400%3B1%2C700&family=%27DM+Mono%27%3Aital%2Cwght%400%2C400%3B0%2C700%3B1%2C400%3B1%2C700&family=%27DM+Sans%27%3Aital%2Cwght%400%2C400%3B0%2C700%3B1%2C400%3B1%2C700&family=Domine%3Aital%2Cwght%400%2C400%3B0%2C700%3B1%2C400%3B1%2C700&family=%27EB+Garamond%27%3Aital%2Cwght%400%2C400%3B0%2C700%3B1%2C400%3B1%2C700&family=Epilogue%3Aital%2Cwght%400%2C400%3B0%2C700%3B1%2C400%3B1%2C700&family=Figtree%3Aital%2Cwght%400%2C400%3B0%2C700%3B1%2C400%3B1%2C700&family=%27Fira+Sans%27%3Aital%2Cwght%400%2C400%3B0%2C700%3B1%2C400%3B1%2C700&family=Fraunces%3Aital%2Cwght%400%2C400%3B0%2C700%3B1%2C400%3B1%2C700&family=%27IBM+Plex+Mono%27%3Aital%2Cwght%400%2C400%3B0%2C700%3B1%2C400%3B1%2C700&family=%27IBM+Plex+Sans%27%3Aital%2Cwght%400%2C400%3B0%2C700%3B1%2C400%3B1%2C700&family=%27Josefin+Sans%27%3Aital%2Cwght%400%2C400%3B0%2C700%3B1%2C400%3B1%2C700&family=Jost%3Aital%2Cwght%400%2C400%3B0%2C700%3B1%2C400%3B1%2C700&family=%27Libre+Baskerville%27%3Aital%2Cwght%400%2C400%3B0%2C700%3B1%2C400%3B1%2C700&family=%27Libre+Franklin%27%3Aital%2Cwght%400%2C400%3B0%2C700%3B1%2C400%3B1%2C700&family=Lora%3Aital%2Cwght%400%2C400%3B0%2C700%3B1%2C400%3B1%2C700&family=Merriweather%3Aital%2Cwght%400%2C400%3B0%2C700%3B1%2C400%3B1%2C700&family=Montserrat%3Aital%2Cwght%400%2C400%3B0%2C700%3B1%2C400%3B1%2C700&family=Newsreader%3Aital%2Cwght%400%2C400%3B0%2C700%3B1%2C400%3B1%2C700&family=Nunito%3Aital%2Cwght%400%2C400%3B0%2C700%3B1%2C400%3B1%2C700&family=%27Open+Sans%27%3Aital%2Cwght%400%2C400%3B0%2C700%3B1%2C400%3B1%2C700&family=Overpass%3Aital%2Cwght%400%2C400%3B0%2C700%3B1%2C400%3B1%2C700&family=Petrona%3Aital%2Cwght%400%2C400%3B0%2C700%3B1%2C400%3B1%2C700&family=Piazzolla%3Aital%2Cwght%400%2C400%3B0%2C700%3B1%2C400%3B1%2C700&family=%27Playfair+Display%27%3Aital%2Cwght%400%2C400%3B0%2C700%3B1%2C400%3B1%2C700&family=%27Plus+Jakarta+Sans%27%3Aital%2Cwght%400%2C400%3B0%2C700%3B1%2C400%3B1%2C700&family=Poppins%3Aital%2Cwght%400%2C400%3B0%2C700%3B1%2C400%3B1%2C700&family=Raleway%3Aital%2Cwght%400%2C400%3B0%2C700%3B1%2C400%3B1%2C700&family=%27Roboto+Slab%27%3Aital%2Cwght%400%2C400%3B0%2C700%3B1%2C400%3B1%2C700&family=Roboto%3Aital%2Cwght%400%2C400%3B0%2C700%3B1%2C400%3B1%2C700&family=Rubik%3Aital%2Cwght%400%2C400%3B0%2C700%3B1%2C400%3B1%2C700&family=Sora%3Aital%2Cwght%400%2C400%3B0%2C700%3B1%2C400%3B1%2C700&family=%27Source+Sans+Pro%27%3Aital%2Cwght%400%2C400%3B0%2C700%3B1%2C400%3B1%2C700&family=%27Source+Serif+Pro%27%3Aital%2Cwght%400%2C400%3B0%2C700%3B1%2C400%3B1%2C700&family=%27Space+Mono%27%3Aital%2Cwght%400%2C400%3B0%2C700%3B1%2C400%3B1%2C700&family=Texturina%3Aital%2Cwght%400%2C400%3B0%2C700%3B1%2C400%3B1%2C700&family=%27Work+Sans%27%3Aital%2Cwght%400%2C400%3B0%2C700%3B1%2C400%3B1%2C700&display=swap