We’ve had Design Assets available in the Pen Editor for the last 6 months or so. We’ve now cleaned it up a bit and ported it over to the Project Editor as well!

Click the Assets button in the footer and now, alongside all your own uploaded assets, you have quick access to a variety of designery things like colors, icons, photos, and patterns.

Connoisseurs of the Design Assets area will notice some new UX niceties, we hope.

For example, of course, you can still search for photos (provided by Unsplash) and click the photo to grab a URL for it, but you can also open the menu to grab the photo in different code formats and sizes.

For another, the Fonts area now has a menu that includes not only copying the HTML (or CSS) to include the font, but the font-families as well, so you have everything you need to quickly grab one of Google Fonts’ most popular fonts.

There are upgrades to your own uploaded files as well. Copying the URL for them is as easy as a button click, previewing is as easy as hovering over that eye icon, and now there is a contextual menu for doing specific things with the asset.

For example, for your images you’ll be able to copy them as <img> or background-image. For CSS you’ll be able to copy as a <link> and JavaScript as a <script>. Plus, a way to pop open any asset in the Asset Manager, which is a good reminder that even after you upload an asset, you can edit it.