|
|
|
|
Issue #75 (CSS/HTML, SVG, jQuery Plugins)12/25/14
Support this week's primary sponsor:
 |
Your first month of Learnable for just $1!
Learnable is all about making web development easier, more accessible, and better. Until the end of the year, we're offering a month's access to Learnable for only $1. |
There will be no tutorial this week and next week, during the holiday time. But as always, check out another great roundup of scripts, plugins, and other tools that might fit into your workflow in a current or future project.
And don't forget, all back issues of Web Tools Weekly are available in the archive, which can easily be searched via Google using Google's site-specific search feature (e.g. type "site:webtoolsweekly.com" in the search box before your search terms).
I'll be back with the usual introductory section in 2 weeks. See you in 2015!
Now on to this week's tools!
HTML and CSS Tools
CSS Color Chart
A rainbow-ordered categorization of color names in CSS with easy access to the name, hex, and RGB values for each color.
Squire
"The <textarea> of the future", Squire is an HTML5 rich text editor created as a component for writing-based apps.
Mailmalade
"Quickly build compatible newsletters. With your design files. Without coding knowledge."
UCSS
A configurable collection of reusable utility classes that aims to be used as silent classes or directly in your markup.
Google Font OpenType Feature Preview
A tool to easily preview fonts from the Google Fonts directory.
colourSpy
Chrome extension "to quickly find and preview colours used on a website. It displays them all in a list of swatches where you can easily copy the corresponding RGB, HEX or HSL values."
Jotform Form Designer
"Allows users to create custom forms in a fraction of the time it once took using standard CSS."
Buttons
"A highly customizable production ready mobile web and desktop CSS button library."
podcast-player
"A web component for audio podcasts. It has a few features that make it most suitable for podcasts."
| Support Web Tools Weekly: 384 pages of CSS for $7 |
Multimedia Tools
mermaid
Generate diagrams and flowcharts from text in a similar manner as markdown.
Clappr Player
"An extensible media player for the web."
SVG-edit
An Illustrator-like GUI tool for creating SVG graphics.
PhotoSwipe
A dependency-free JavaScript photo gallery with touch gestures for mobile.
SVG-Loaders
"Loading icons and small animations built purely in SVG, no CSS or JS."
deSVG
"Takes the <img /> tags you supply. It then grabs, using Ajax, the raw SVG you've set in the 'src' attribute and replaces that <img /> with the <svg /> it downloads."
TinyJPG
"Compress JPEG files with a perfect balance in quality and file size."
SVG Morpheus
"JavaScript library enabling SVG icons to morph from one to the other."
jQuery Plugins
Labelauty
"Gives beauty to checkboxes and radio buttons and allows custom labels for each status of (un)checked inputs."
stickyNavbar.js
"Helps you stick your navigation bars to the top of the browser window during scrolling" and also includes options to add jQuery or CSS animation effects, and more.
Focusable
Adds a "spotlight" type effect on any element on the page, adding a dark overlay to the rest of the page.
Four Shadows
"Time-aware, algorithm driven shadows for icons."
tablesorter
"For turning a standard HTML table with THEAD and TBODY tags into a sortable table without page refreshes."
jQuery.DebugCssAnimation
A CSS animation debugger. It creates a "control station" for you, to allow you to pause, play, and reset targeted elements.
Multiple Select
Converts a typical CTRL-click multi-select HTML element into a nicer looking checkbox-based select element.
Select2
"A jQuery based replacement for select boxes. It supports searching, remote data sets, and infinite scrolling of results."
| Support Web Tools Weekly: 384 pages of CSS for $7 |
A Tweet for Thought
Paul Irish, quoting Juriy "kangax" Zaytsev from a Hacker News thread, reminds us that there's a better place to be than on the bleeding edge.
Suggestions / Corrections
Made something? Send links via Twitter @WebToolsWeekly (details here). No tutorials or articles, please. If you have any suggestions for improvement or corrections, feel free to reply to this email.
Before I Go...
Here's a simple but cool OSX Terminal tip posted on Hacker News that instigated a pretty lengthy discussion thread of various other tips and techniques.
Thanks to all for subscribing and reading!
Keep tooling,
Louis
webtoolsweekly.com
@WebToolsWeekly
|
|
|
|
|
|
|
