Design & UX
![20 Simple Ways to Style the HTML details Element](jpg/1697843489style-html-details-element-300x190.jpg)
Learn simple ways to style the HTML details element, which is a very useful element for revealing and hiding bits of content on a web page.
![6 Ways the Progress Design System Kit Makes UI Design Fun](jpg/1697672710telerik-progress-design-system-300x170.jpg)
Learn about Telerik's Progress Design System, an end-to-end design language for creating simple, intuitive and beautiful experiences.
![How to Remove a Background in Photoshop: 7 Quick & Easy Methods](jpg/1576625640remove-background-photoshop-300x157.jpg)
Need to remove an image background? Learn seven ways to remove a background in Photoshop, depending on the kind of image you're working with.
![6 Must-have Ecommerce Design Elements](jpg/1695785894ecommerce-design-elements-300x170.jpg)
Learn about the must-have ecommerce design elements that help ensure an online business serves customers well and generates brand loyalty.
![The Best Free Online Image Editors](jpg/1679985173google-fonts-font-display-300x170.jpg)
We delve into the top free online photo editors and explore their features to help you discover the solution for your design needs.
![The Best Figma Plugins to Enhance Your Design Workflow in 2023](jpg/1680328749wordpress-contact-forms-300x170.jpg)
In this article, we'll explore the top Figma plugins that every designer should consider using to enhance their design workflow in 2023.
![10 Simple CSS and JavaScript Micro-interactions for Buttons](jpg/1690179564button-micro-interactions-300x170.jpg)
Learn ten simple ways to add micro-interactions to buttons on a web page that help inform users when they've successfully done something.
![Quick Tip: Pull Data from an API into a Figma Layer](jpg/1679897824figma-pull-api-data-300x170.jpg)
Discover how to use the Data Sync plugin to easily pull data from an API into a Figma Layer
![Quick Tip: Removing the Background from an Image in Figma](jpg/1679895118figma-remove-background-300x170.jpg)
Discover how to use the plugin Icons8 Background Remover to quickly and easily remove backgrounds from images in Figma
![Creating a Custom Button Icon in Figma](jpg/1679885524figma-custom-button-300x170.jpg)
Dive into how illustration works in Figma. In this tutorial, we’ll learn how to draw and manipulate vectors in Figma as we create an icon.
![5 Web Design Trends to Watch in 2023](png/1672733143web-design-trends-2023-300x150.png)
Curious to see what kinds of new web design trends 2023 will bring? In this post, we’ll look at 5 of them and explain how each will help you build better websites for users.
![Getting Started with Lottie.js](gif/1656484204lottie-opt-300x150.gif)
Lottie.JS is a fantastic animation platform, but what animation tool should you choose? Alex has the ideal Lottie primer.
![UI Design Inspiration: Do You Think About Your Textures?](jpg/1655692417featrue-pattern-300x150.jpg)
Looking for UI design inspiration? Rather than adding a new color or changing a font, have you thought about your textures?
![Web Typography: Establishing a Strong Typographic System](png/1654563914mobile-vs-laptop-300x192.png)
Setting up a new typography system is always a complicated task with literally hundreds of tweakable variables. The best way to save your sanity is a design system that can answers most of those little questions.
![6 Clever SVG Pattern Generators for Your Next UX Design](jpg/1655276258god570m-300x201.jpg)
Though SVG Patterns aren't super widely understood, they offer a lot of really interesting design options – once you get your head around them.
![How to Use Variables in CSS: CSS Custom Properties](png/1654482584css-variables-300x150.png)
Learn how to use CSS variables (custom properties) to make it easier to manage colors, fonts, and size consistently across web applications.
![How to Create a Color Palette for Your Design System](jpg/1651637815cpds-300x158.jpg)
A color palette is one of the most important aspects of a design system. Designers can use them to create a visual hierarchy, a unified look and feel, and evoke emotions.
![The Best Figma Plugins to Create & Manage Design Systems](jpg/1648239117featured-300x158.jpg)
Figma is a powerful tool for creating design systems. Learn about the best Figma plugins for design systems and managing complex projects.
![An Introduction to User Journey Maps](jpg/1646355867user-journey-mapping-300x170.jpg)
Understanding user experience is crucial for successful business. Learn how user journey maps help to optimize your products and services.
![The Best Figma Plugins: 50+ Workflow Superchargers](jpg/1642648108design-300x158.jpg)
Too many Figma plugins to choose from? Supercharge your design workflow with our picks for the best Figma plugins.
![5 Upcoming Web Design Trends for 2022](jpg/1639542641web-design-trends-300x170.jpg)
Web design trends bring much-needed yet subtle changes to the look of the Web. Learn about upcoming trends for 2022 and how to harness them.
![The 5 Best Design Handoff Tools](jpg/1637034391design-handoff-300x170.jpg)
Handing off designs to developers has a troubled history. Learn about 5 excellent apps that have revolutionized the design handoff process.
![SitePoint NFTs – or how we floated rhinos on the OpenSea](jpg/1634858073291_-_the_rackley_rhino-300x209.jpg)
After 20+ years and over 100 book cover designs, we’re releasing a strictly limited run of our latest design work as purchasable digital art.
![Moving Backgrounds: When, Why, and How to Use Them](png/1623901012moving-backgrounds-300x170.png)
Moving backgrounds look cool, but they're not always a good idea. Learn their pros and cons, and when might be a good time to use one.
![Figma Prototypes: A Quick, Step-by-Step Guide to Useful Mockups](jpg/1617712891ux-proto-300x158.jpg)
Take your wireframes and mockups to the next level by creating interactive FIgma prototypes that are navigable and animated. Here's how!
![5 Web Design Trends for 2021](png/1612665278web-design-trends-2021-300x170.png)
Web design trends come and go. 2020 was no exception. Web designers will see some familiar trends replaced by safer and more dependable design choices.
![An Introduction to Wireframing with Figma](jpg/1613785932figma-wireframing-1200-300x158.jpg)
Wireframes are important for ensuring good UX. Learn how to use Figma to figure out the best UX design workflow for your layout.
![7 Tips for Writing Clear, Human-friendly Microcopy](png/1611803701microcopy-ux-300x170.png)
Want to lose users? Miss out on sales? No? Learn seven easy ways to make sure the wording on your app isn't sending users and profits away!
![How to Improve User Experience with Accurate User Feedback](png/1609807896better-ui-feedback-300x170.png)
You submit a form—but get no feedback. Wha? Did it submit? Learn how to make sure your UI elements provide feedback to users—so that you don't lose them!
![8 Cross-Browser Testing Tools You Need in 2022](jpg/1469286881stack-300x200.jpg)
Though browsers are arguably more reliable than they've ever been, we still can't forget about cross-browser testing tools. Here are 7 top options for you.