Styled Components with Stiches
shorts |
Are you into styled components, Check out this framework agnostic, an interesting API with a short learning curve and lots of features. I'm not sure I'm sold on this quite yet, although they're a good idea for component based architectures.
State of CSS Survey
shorts |
This is one of the most comprehensive once a year surveys on how the community feels about different libraries, tools and features. If you want to get the results or just want to contribute to the community, it's a simple way to cast a vote.
AtroposJS
shorts |
You totally didn’t know you wanted to use this library until you visit the site and play around with it. A framework compatible library for building touch enabled 3d parallax transformations. Sounds like it should be in some sort of Web Developer bingo pool.
React Preview
shorts |
A React Plugin for Visual Studio Code, WebStorm or the command line that lets you preview all of a project's components and storybook stories. Sort of like an in browser preview that you get with the react chrome tools.
Flag Icons
shorts |
Bookmark this when you need a flag in SVG format...Hey website, Panama is in Central...not North America.
Motion One
shorts |
Close to a tenth the size of Greensock (which I love), this animation framework focuses on performance by using hardware acceleration. Pretty promising.
Linkify JS Library
shorts |
Interesting JS plugin to help you convert links, hashtags and mentions to URLs. Works through npm or as a link in your HTML. There's support for frameworks like React and more.
HTML Entity Finder
shorts |
Do you know the unicode for an arrow? Me neither, so I'm glad I found this site with the common codes for all the weird characters I don't remember.
Guide to HTML Head Elements
shorts |
Your head might need some aspirin after taking a peek at this site with exhaustive information on just about everything that could go in the HEAD section of your site.
Picking a Good Line Height
shorts |
I'm often unhappy with the line-height settings for my CSS, so this site lets you calculate the optimal line-height visually for different fonts sizes. Cool.
System Font Stack
shorts |
Instead of loading custom fonts, you can easily use device defaults instead. This site has a list of what to set your CSS to if you want to start your designs with the fast loading build-in fonts for most devices.
Flexbox Patterns...FTW-For The Win
shorts |
All the cool kids love to tell you how great CSS Grid is, but Flexbox still has a lot of Mojo and is better for some things. This cool site has a number of prebuilt patterns for different layouts using Flexbox...Take that...CSS Gridsters.
MilkDown-Pluggable Markdown Editor
shorts |
Lightweight and powerful, I didn't think I would like this markdown editor, but it's pretty terrific. LaTex math equations, table support, copy and paste markdown, Collaboration and emoji support.
|
Hypercolor - Tailwind/CSS Color Gradients
shorts |
I can be a bit color challenged, so I appreciate a good site with inspiring gradients gives me the Tailwind or CSS code quickly. Great interface with lots of customization options.
Daisy UI - Component Library for Tailwind CSS
shorts |
Tailwind is really just an engine for building components, but it doesn't include any components of it's own. Daisy UI uses Tailwind CSS and it gives you a set of components to build sites quicker. It installs as a Tailwind CSS plugin so it's easy to add to your existing project. Think of it as the missing Bootstrap-style link to Tailwind CSS.
Tailwind Kit - UI Components for Tailwind CSS
shorts |
A beautiful UI component showcase for Tailwinds UI. It has a lot of smaller elements like buttons, forms, navigation and lists as well as larger templates for bigger things. Over 250 components and templates that are also React/Vue/Angular compatible.
Tailblocks - Free Tailwind CSS Component Code
shorts |
Tailwinds CSS is great, but it doesn't come with any built in components. A few industrious developers have been creating their own. This is a pretty good selection of ready to go components with everything from ecommerce, navigation, testimonials and blog elements you can copy and paste from. It also has an easy to use interface to copy and preview the blocks.
Notistack - React Compatible Notification Library
shorts |
This is a really nice library for building notifications with React with a lot of options. The best part is the way the examples section lets you choose the different options and it builds the code for you. I wish every demo worked like this.
JS Zip - Read, Write and Create Zip Files
shorts |
This JavaScript library gives you tools to read, write or create Zip files directly from JavaScript, which gives you access to content stored as zip files on your server, or the ability to quickly zip a group of files through your own projects. I'm putting that into my...might be useful at some point bucked.