Welcome to another edition of Polar’s Tip of the iceberg, sharing with you various extensions, tools, shortcuts, and directions to help designers save time, get more done, and improve outcomes as a whole.
In this edition, we’ll go into items for Webflow, UX, Figma, Javascript, and the sort, and you’re welcome to check February’s edition for other tips.
As always, we hope you find these useful and if you do, let us know about it and pay it forward by sharing it with your colleagues, contacts, and friends.
And better yet, we’d love to hear some tips of your own :)
While Webflow provides a no-code direction, sometimes you do want to add code for specific needs, or customization, or other things you haven’t found the exact component you want.
Where CodeMode helps is by allowing the designer/developer to write code easier within a Full screen panel in the Webflow designer, rather than small page settings.
Whoa, this is convenience bliss :)
Check out CodeMode for Webflow
Even before starting to design or develop your website, you’re conducting research and looking over different sites and technologies to get a sense of what will fit your needs and beyond.
This is where Wappalyzer comes in by being your very own Technology profiler, breaking down which CMS websites are using, frameworks, ecommerce platforms, Javascripts, uncovering thousands of technologies in several categories.
Just a whole new world to investigate with.
Check out Wappalyzer
Easily extract CSS styles without having to look into code :)
For designers, this is heaven sent, letting them focus on design rather than search for CSS styles within the code. With CSS Peeper, you can figure out line-height, fonts, button sizes, and gather exactly the information you’re looking for.
Check out CSS Peeper
What an amazing resource to get a broad overview of the different UX principles which isn’t only informative but is very well designed…UX-wise especially :)
The Laws of UX covers best practices for designers to learn from, use as reference, and go back to again and again when reviewing their own designs and decisions.
Go take a look at Laws of UX
Able is a very practical Figma plugin that helps you check color contrast & color blindness compatibility for accessibility.
Once Able is opened, it automatically compares the contrast of two layers, so you can keep it open and maintain your workflow as accustomed to.
Try out Able
Tippy.js is an amazing javascript library for tooltips, consisting of tips, popovers, dropdowns, and menu solutions, helping you get more out of Webflow.
At its core, it is simply a vanilla javascript library, providing samples that let you tailor the exact match for your design with the logic and optional styling of elements.
Check out Tippy.js for all customization options, or go straight to their Easy Tooltips for Webflow.
Thank you again for joining us for our monthly tip sharing, coming straight from the Polar team, who use these tools and ideas for their own routines.
.png)
.png)
.png)