Free resources from the design community can improve a web project.
Here is a list of new tools and design elements from spring 2022. This list includes project collaboration tools, site generators, API resources, color palettes, checkout optimizers, loading icons, free fonts, and more. All the tools are free or have free plans.
Free Design Tools
Werk is a remote working toolkit for teams to work seamlessly through asynchronous collaboration. Manage and build tasks, share files and HyperDocs, take notes and collaborate on voice chat, and asynchronously collaborate on records. Free for up to five teammates.
Werk
–
Pages is a new resource for Scribe, an application for creating step-by-step guides and product demos. With Pages, you can now combine Scribe recordings on a process document and add text, descriptions, hyperlinks, Loom and YouTube videos, and more.
–
API Tracker is a search engine to find the best APIs and SaaS applications to build native integrations. Track API specs and docs, developer experiences, SDKs, developer docs, IDE support, platform strength, authentication, and API styles. Free for up to 2,000 API calls per month.
–
Eleventy is a new and straightforward static site generator. It allows you to mix and match templating engines to easily migrate existing content, transforming a directory of templates into HTML. Content templates can use a different templating engine than layout files. Eleventy works with HTML, Markdown, JavaScript, Liquid, Nunjucks, Handlebars, Mustache, EJS, Haml, and Pug.
Eleventy
–
Reasonable Colors is an open-source system to build accessible, nice-looking color palettes. Spaced uniformly, the 24 sets of named colors each have a hue 15 degrees from its neighbors on the LCH color wheel. This uniform spacing makes it simple to find complementary pairs and build attractive color palettes.
–
SellKit is a checkout optimizer for WooCommerce that uses dynamic discounts, smart coupons, and checkout alerts to drive more sales, increase order value, and boost engagement.
–
Loaders is a collection of free animated loaders (visible on a web page as it’s loading) to add to your next project. Built with HTML, CSS, and SVG, these loaders are fun, creative, and pleasing.
Loaders
–
Lexical is an extensible JavaScript text-editor framework that scales in size and functionality. Lexical makes it possible to easily create complex text editing experiences that otherwise would be very complex with the built-in browser tooling.
–
Scrollex is a React library for building beautiful scroll experiences using minimal code. Scrollex provides keyframe helpers to define the elements of each scroll position.
–
Formspector is a tool to ensure forms are working. Set up automated tests for any form without writing a line of code. Review your forms for newsletters, contact us, signup, support, and other uses. Free for up to three forms.
Formspector
–
QlndR.io is a handy QR code generator for events and appointments. Smartphones automatically add the event to a calendar and show the user if there’s any conflict at that time.
–
Sections are new building blocks and full-site templates