Articles

25 Exciting New Tools For Designers, April 2021

,

Rather than spring cleaning, do some spring “shopping” for tools that will make your design life easier. Packed with free options this month, this list is crammed full of tools and elements that you can use in your work every day.

Here’s what new for designers this month:

April’s Top Picks

Charts.css

Charts.css makes creating beautiful online charts that much easier. It’s a modern CSS framework that uses CSS utility classes to style HTML elements as charts. It’s accessible, customizable, responsive, and open source. There’s a quick start option and available source code to work with.

Haikei SVG Generator

Haikei is a web app that helps you generate SVG shapes, backgrounds, and patterns in all types of shapes to use in projects. Everything can be exported into the tools you are already using for easy integration, and every element is customizable. The tool is free right now – no credit card needed – and you get access to 15 generators and can export in SVG and PNG format. A premium option is on the way, and you can sign up to get notified for access.

Fluid Space Calculator

Fluid Space Calculator helps you create a related space system and export the CSS to implement it. The calculator allows you to add space value pairs and multipliers and see the impact on the screen before snagging the related code. It’s great for determining how things will look in different viewports and for creating custom space pairs.

Night Eye WordPress Plugin

Night Eye WordPress Plugin helps you create a dark mode option for your WordPress website with ease. It’s completely customizable, schedulable, and one of those things that users are starting to expect. The plugin has free and paid versions – the only difference is a link to credit the developer.

3 Productivity Boosters

Macro

Macro is a supercharged checklist app for recurring processes. It’s designed to help teams document, assign, track, and automate for maximum efficiency. Now is the time to test this tool because it is free in public beta.

Writex.io

Writex.io is a free writing app that uses AI and smart features to help you write more efficiently. It can check readability as you write, make suggestions, check spelling, and allows you to work with versioning. All the settings are customizable, so you can get help and suggestions when you want them and avoid things you don’t want.

Taloflow

Taloflow, which is in beta, is a tool that helps you find the top cloud and dev tools for your use case. This is designed to be a time-saving solution to finding the right infrastructure and API products for your work.

8 Kits with Illustrations and User Interface Elements

Skribbl

Skribbl is a collection of free, hand-drawn illustrations in a light and fun style. The black and white sketches are friendly, and the collection keeps growing. Plus, the illustrators are allowing them to be used free for any use.

Mobile Chat Kit

Mobile Chat Kit is a free starter kit for building apps in Figma, Sketch, and Adobe XD. It includes more than 50 screen options with mapped-out flows for a quick-start project.

Flowchart.fun

Flowchart.fun is exactly what the name implies. The app allows you to type, create nodes, and link elements to develop simple flow charts quickly. Then you can alter shape and size with drag and drop. Export it for use as an SVG, JPG, or PNG.

Shuffle

Shuffle is a marketplace packed with UI libraries to help you with a variety of digital projects. There are more than 1,500 pre-built components to choose from with professional designs. This premium tool comes with a monthly subscription or lifetime license.

Cryptocurrency 3D Pack

Cryptocurrency 3D Pack is a set of icons with fun colors in three-dimensional shapes that you can use to represent different crypto elements. The pack includes 55 #D icons in PNG and BLEND formats.

Stratum UI Kit for Figma

Stratum UI Kit for Figma includes nine free screens that are ready to use. Options include API documentation, Kanban, document, data dashboard, ecommerce product list, ecommerce product options, payments spreadsheet, cloud storage, and newsfeed.

Conic.css

Conic.css is a collection of simple gradients that you can browse and then click to copy the code into your CSS to use them in projects. It’s quick and easy while using trendy color options.

Artify Illustrations

Artify Illustrations is a Figma plugin that allows you to access more than 5,000 SVG and PNG illustrations within the app. It’s got a built-in search feature, everything is high-resolution, and the huge library includes various styles.

2 Tutorials

A Complete Guide to Accessible Front-End Components

A Complete Guide to Accessible Front-End Components is an amazingly comprehensive guide from Smashing Magazine with everything you need to know about accessible components. From tabs to tables to toggles to tooltips, you’ll find it all here and learn how to use it the right way.

Grid CheatSheet in 2021

Grid CheatSheet in 2021 is a useful guide of everything you can do with CSS Grid. Plus, it has plenty of fun illustrations and an accompanying video.

8 Fresh and Fun Fonts

Athina

Athina is a modern display serif with beautiful connector strokes. The free version is a demo, and there’s a full family that you can buy.

Brique

Brique is a free (personal and commercial) display font with a wide stance and uppercase character set. The letters have a lot of personality and a readable configuration.

Code Next

Code Next is a great geometric sans serif with a full family of styles. Including two variable fonts. It’s highly readable and would work for almost any application.

Inter

Inter is a simple and functional sense serif family with everything from extra light to heavy weights. The extra character personality makes this a fun and functional font option.

Nothing Clean

Nothing Clean is a fun grunge-type option. It’s an all uppercase character set with alternates.

Playout

Playout is a fun, hand-drawn style typeface with interesting glyphs and alternate characters. The most fun feature might be the pawprint characters in the demo set.

Rockford Sans

Rockford Sans is a geometric typeface with subtly rounded edges. It has eight weights and italics. With its large x-height and round features, it’s legible and friendly. It’s suited to cover a wide variety of tasks from editorial to brand design and advertising.

SpaceType

SpaceType is a fun and funky typeface in regular and expanded styles. The stretched letterforms make interesting alternates for display purposes.

Source

The post 25 Exciting New Tools For Designers, April 2021 first appeared on Webdesigner Depot.


Source de l’article sur Webdesignerdepot

/par

23 Exciting New Tools for Designers, February 2021

,

We’re going to try something a little different this month; with this roundup of tools and resources for designers, we’re going to pick a few of our favorites and group everything else in a manner that makes it even easier to find elements that will work for you, and your projects, right now.

Here’s what’s new for designers this month…

February’s Top Picks

Pika

Pika is a new Mac app that is an open-source color picker. It helps you find color swatches on-screen, saving time and design headaches. Plus, it’s packed with bonuses such as the ability to confirm accessibility compliance for colors, compact size and style, easy to access from your desktop, and format-friendly with plenty of color code options.

Iconduck

Iconduck is a searchable database of more than 100,000 icons in one place. (No more searching various marketplaces!) The goal of the project is to make open-source icons and illustrations more accessible. So, everything you find here is free! The site does all the heavy lifting for you by collecting icon sets, tagging them, and making them searchable.

Descript

Descript is a premium tool that eliminates some of the intimidation factors with audio and video editing. With a design that functions as a word document and allows you to transcribe, record the screen, publish, and edit, all with some cool AI features.

Persona

Persona is an all-in-one identity infrastructure that allows you to collect, verify, manage, and decide customer identities from a single dashboard. Everything is fully automated, and most users can be up and running in about 10 minutes. The premium tool does have a free version for small-scale verifications.

6 Productivity Boosters

Peekalink

Peekalink turns standard links into rich content that users will be delighted to share and engage in. And it’s easy to use. Just send a request to the API with a link and get a response back to use, including a rich link for your project.

LinkAce

LinkAce is an open-source and self-hosted archive to store and organize links that you want to save. You can search thanks to tags and lists, and all of the content is available thanks to automated backups and monitoring. There’s a demo you can try before installing it yourself.

Formality

Formality is a WordPress plugin that helps you make forms a little bit easier. It’s made to work with the Gutenberg-based form builder with a single block format to control the form. The plugin has a theme-agnostic design that works with any layout style and includes customizations to make it feel a little more personal.

Wondercall

Wondercall is an embeddable video call system for any website or app. You can make calls and schedule them with a widget you can embed right into your design.

Editor X

The Editor X website builder is out of beta and ready for mainstream use. The platform is designed for designers and agencies to create websites collaboratively and quicker. Features include live commenting, roles and permissions, and shared design libraries. Plus, the platform offers code-free interactions.

Shareful/h2>

Shareful is a Mac app that makes the system share menu more powerful. You can copy, save as, and open indirectly from the system share menu.

2 Icon Sets

Supercons

Supercons is a giant set of icons in React. They are all open-source, and there are plenty of choices to help you propel projects forward.

Plumpy Icons

Plumpy Icons are packed with style. The set of icons has a fun design, comes in duotone colors, and scales to any size. Plus, there are more than 4,000 icons in the collection. There are free and paid options depending on the file type and use.

3 Tutorials and Demos

Noise Planets

Noise Planets is a fun look at plotting random points in a circle to create amazing art pieces. You can generate fun shapes and textures and even animate your results with the tutorial and code snippets’ help.

CSS Polygon Shapes

CSS Polygon Shapes are generated using CSS-doodle and clip-path. You can go in and make adjustments to customize shapes further and use them in your website projects.

Mutsuacen

Mutsuacen is a little app that lets you create animated and interactive drawings. There’s a lot of potential with this tool if you have some true drawing chops, but it not; it’s just fun to play with. Create a doodle or sketch and export.

5 Fresh Fonts and Text Tools

Text Warping – Animated

Text Warping – Animated is a fun effect pen from Lokesh Dhakar. It feels funky while leaving text pretty readable. Play with it for sure.

Gazpacho

Gazpacho is a fun and flexible premium font family with 14 styles from thin to heavy italic. It’s a highly readable serif with a wider stance and great curves.

Stay Home

Stay Home is a simple, line-style all caps font. It has a limited character set but could have some fun applications.

Dogmeal Figure

Dogmeal Figure is an almost silly novelty typeface with dog faces and paw prints in the character set. It might make a fun option for a kids’ project.

Haster

Haster is a futuristic-style slab with a limited character set. It does have shapes and lines with a lot of impact for display use.

Covid Pandemic Lockdown

Covid Pandemic Lockdown is an interesting novelty font with thick lines and a brush-dot style. While it probably won’t read well small, it could be fun as a display option.

Valeria

Valeria is a simple typeface that’s a little wide but has a nice shape and structure. It includes upper- and lowercase letters.

Cornellia

Cornellia is a beautiful script that has amazing letter combinations for use with long swashes and tails. It can add extra elegance to almost any design project instantly.

Source

The post 23 Exciting New Tools for Designers, February 2021 first appeared on Webdesigner Depot.


Source de l’article sur Webdesignerdepot

/par

Exciting New Tools for Designers, November 2020

,

In the spirit of fall feasts, this month’s collection of tools and resources is a smorgasbord of sorts. You’ll find everything from web tools to icon libraries to animation tools to great free fonts. Let’s dig in.

Here’s what new for designers this month.

The Good Line-Height

The Good Line-Height is the tool you won’t be able to live without after using it a few times. The tool calculates the ideal line-height for every text size in a typographic scale so that everything always fits the baseline grid. Set the font size, multiplier, and grid row height to get started.

Link-to-QR

Link-to-QR makes creating quick codes a breeze. Paste in your link and the tool creates an immediate QR code that you can download or share. Pick a color and transparency, plus size, and you are done.

Quarkly

Quarkly allows you to create websites and web apps both using a mouse and typing code – you get all the pros of responsive editing, but can also open the code editor at any time and manually edit anything and it all synchronizes. The tool is built for design control and is in beta.

UnSpam.email

Unspam.email is an online spam tester tool for emails. Improve deliverability with the free email tester. The service analyzes the main aspects of an email and returns a spam score and predicts results with a heat map of your email newsletter.

Filmstrip

Filmstrip allows you to create or import keyframe animations, make adjustments, and export them for web playback. It’s a quick and easy tool for modern web animation.

CSS Background Patterns

CSS Background Patterns is packed with groovy designs that you can adjust and turn into just the right background for your web project. Set the colors, opacity, and spacing; then pick a pattern; preview it right on the screen; and then snag the CSS. You can also submit your own patterns.

Neonpad

Neonpad is a simple – but fun – plain text editor in neon colors. Switch hues for a different writing experience. Use it small or expand to full browser size.

Link Hover Animation

Link Hover Animation is a nifty twist on a hover state. The animation draws a circle around the link!

Tint and Shade Generator

Tint and Shade Generator helps you make the most of any hex color. Start with a base color palette and use it to generate complementary colors for gradients, borders, backgrounds, or shadows.

Pure CSS Product Card

Pure CSS Product Card by Adam Kuhn is a lovely example of an e-commerce design that you can learn from. The card is appealing and functional.

Free Favicon Maker

Free Favicon Maker allows you to create a simple SVG or PNG favicon in a few clicks. You can set a style that includes a letter or emoji, font and size, color, and edge type and you are ready to snag the HTML or download the SVG or PNG file.

Ultimate Free iOS Icon Pack

The Ultimate Free iOS Icon Pack is a collection of 100 minimal icons in an Apple style. With black and white version of each icon and original PSD files, you can create sleek icons for your iPhone screen in minutes. And it’s completely free! No email address or registration required.

Phosphor Icon Family

Phosphor is a flexible icon family for all the things you need icons for including diagrams and presentations. There are plenty of arrows, chats, circles, clocks, office elements, lists, business logos, and more. Everything is in a line style, filled, or with duotone color. Everything is free but donations are accepted.

3,000 Hands

3,000 Hands is a kit of hands that includes plenty of gestures and style in six skin tones and with 10 angles of every gesture. They have a 3D-ish shape and are in an easy to use PNG format. This kit has everything you need from a set of hand icons.

Radix Icons

Radix Icons is a set of 15px by 15px icons for tiny spaces. They are in a line style and are available in a variety of formats including Figma, Sketch, iconJar, SVG, npm installation, or GitHub.

Deepnote

Deepnote is a new kind of data science notebook. It is Jupyter-compatible with real-time collaboration and running in the cloud and designed for data science teams.

ZzFXM Tiny JavaScript Music Generator

ZzFXM is a tiny JavaScript function that generates stereo music tracks from patterns of note and instrument data. Instrument samples are created using a modified version of the super-tiny ZzFX sound generator by Frank Force. It is designed for size-limited productions.

Image Tiles Scroll Animation

Image Tiles Scroll Animation is a different type of scrolling pattern using Locomotive Scroll. The grid creates a smooth animation in a fun and modern style.

Bubbles

Bubbles is a Chrome extension that allows you to collaborate by clicking anywhere on your screen and then dropping a comment to start a conversation with anyone. This is a nice option for work from home teams.

Tyrus

Tyrus is a toolkit from the design team at Airbnb to help illustrators make the most out of their design businesses. It is broken into sections to help you with design briefs, originality, deadlines, and feedback.

PatchGirl

PatchGirl is an automated QA tool for developers. You can combine SQL and HTTP queries to build any possible state of your database.

Apparel

Apparel is a beautiful premium typeface family with plenty of versatility in a modern serif style. It is a contemporary, classy, and fresh serif typeface with a laid-back. Its medium-large x-height makes it ideal for headlines and brand identity design.

Christmas Story

Christmas Story is a nice solution if you are already starting to think ahead to holiday projects or cards. The long swashes and tails are elaborate and fun.

Nafta

Nafta is a fun handwriting style font that has a marker-style stroke. It’s a modern take on the popular Sharpie font. It includes all uppercase letters.

Safira

Safira is a wide and modern sans with ligatures and a stylish feel. The rounded ball terminals are especially elegant.

Shine Brighter Sans

Shine Brighter Sans is a super-thin sans-serif with a light attitude. The limited character set combined with its light weight is best for display use.

Source


Source de l’article sur Webdesignerdepot

/par

Exciting New Tools for Designers, October 2020

,

This month’s collection of new tools, resources, and freebies for designers is a smorgasbord of sorts. You’ll find everything from useful APIs to icons to tutorials to fonts.

Let’s get right into it, here’s what new for designers this month:

Tooltip Sequence

Now that your app or website is ready, you might need to help users engage with it. Tooltip Sequence is a simple JavaScript package that helps you create a series of small tooltips that will guide users through product features with a small description of what they need to know. It looks great and the best part is this tool saves you from having to create each tooltip description manually on each page and link them together.

Serenade

Serenade allows you to free up your hands with voice coding technology. Use natural speech and stay productive with this tool that allows you to code without typing. It works across multiple coding languages and platforms. It’s as easy as “add function hello” and the tool knows what syntax to use.

Gazepass

Gazepass, which is still in beta, is a nifty API that allows for passwordless multi-factor authentication for any website or mobile app. It uses biometrics on any device or platform to make getting into apps or websites easier for users.

Filters.css

Filters.css is a CSS-only library to apply color filters to website images. Installation only takes three steps and includes a variety of filers, such as blur, grayscale, brightness, contrast, invert, saturate, sepia, and opacity.

Sidebar Webring

Sidebar Webring is a collection of blogs and websites that are focused on web design. The curated list is handpicked for superb content for designers and developers. But, what’s a webring? It’s a collection of linked websites in a circular structure that are organized around a theme. The term is a throwback to the early days of the web in the 1990s and 2000s.

Wicked Templates

Wicked Templates is a set of responsive HTML templates made with Bulma and Tailwind CSS that you can style and use as you wish. Use these templates to jumpstart projects. Free and paid options available.

WP Umbrella

WP Umbrella will help you keep sites running in a healthy and safe manner on WordPress. Monitor uptime and performance, PHP errors, and keep up with hundreds of websites from one dashboard.

Servicebot

Servicebot helps you create customer-facing embeddable billing pages that work with Stripe payments. This premium tool is quite user-friendly and works with websites or SaaS.

Custom, Accessible Checkboxes with Perfect Alignment

Create custom, accessible checkboxes with perfect alignment every time. This walkthrough shows you how to use CSS to align elements and labels.

Sombras.app

Sombras.app is a nifty tool that creates 3D object shadows. Use the easy on-screen controls to get just the right orientation and shape.

urlcat

Urlcat is a tiny JavaScript library that helps you build URLs with dynamic parameters and without mistakes. The friendly API has no dependencies, includes TypeScript types, and is just 0.8KB minified and gzipped.

Reacher

Reacher is a real-time email verification API that lets you check the validity of an address before you send the email. Reduce bounce rates in an instant. (The personal version is free.)

Swell

Swell is a most powerful headless ecommerce platform for modern brands, startups, and agencies. Create fast and flexible shopping experiences with the API and headless storefront themes. This is a premium tool but does have a free trial.

No Code Founders 2.0

No Code Founders 2.0 is a platform for discovering the latest startups built with no-code and the tools used to build them. Browse startups, tools, perks, interviews, jobs, meetups, posts, and more as part of the no-code movement. The community engages on Slack and requires an email to sign up.

How to Pick More Beautiful Colors for Your Data Visualizations

Beautiful color choices will make your data visualizations that much more impactful. This tutorial by Lisa Charlotte Rost will help you make better color choices on the way to better infographics and charts. Plus, it’s well developed, designed, and packed with useful information.

IconPark

IconPark is a collection of more than 1,200 high-quality icons with an interface that allows you to customize them. It uses a single SVG source file that can be transformed into multiple themes. The library includes cross-platform components and is free to use.

Mono Icons

Mono Icons is a simple and consistent open-source icon set that uses mono spacing. The collection includes 136 icons.

BGJar

BGJar is a free SVG background generator for digital projects. Pick a category and customize the result to fit your project or needs.

HitCount

HitCount is almost too simple to be true. This tiny tool lets you add a hit counter to your website that’s as easy as adding an image. Copy the code and make any customizations you want. Then paste it to your design. That’s it!

Blacklight

Blacklight is a real-time website privacy inspector. The tool by Surya Mattu scans any website you enter in the scan bar and shows what user-tracking technologies are used on the website. This allows you to see who might be gathering data about your visit.

Alter

Alter is a customizable – and experimental – three-dimensional typeface that you can experiment with. It’s as fun to play with as use.

Autobus Omnibus

Autobus Omnibus is a simple all capitals font with new wave styling. The character set has 96 glyphs that are perfect for display use.

Deathmatch

Deathmatch is a seasonal blackletter font that’s ideal for the upcoming Halloween holiday. The character set includes plenty of options and there’s a full version (paid) for commercial use.

Futura Now

Futura Now is a premium typeface and update to a font you may already know and love. The new version has 107 styles in a massive family.

Pumpkin Soup

Pumpkin Soup is a fun almost handwriting style typeface with a cartoonish vibe. It includes a regular and italic style and is most appropriate in limited use.

Source


Source de l’article sur Webdesignerdepot

/par