5 In-Browser Tools That Make a Web Developer’s Life Easier


A web developer’s life is often burdened with the task of writing thousands upon thousands of lines of code and sometimes, it’s nice to have little shortcuts to ease up some of the load. Below are five tools that I have found to be incredibly helpful for streamlining the process.

1. Blind Text Generator

Need filler text for that page design? This dummy text generator has the standard Lorem Ipsum, as well as passages from Cicero, Werther, and my favorite, Kafka! What makes Blind Text Generator different from other dummy text sites is its ability to automatically add tags, which saves you the trouble when coding HTML mockups.

2. Border Radius

Rounded corners are a feature introduced with CSS3, eliminating the need to use graphics to round out divs and other containers. The CSS code for rounded corners is a bit complex and requires several versions to cover all the major browsers. Border Radius not only allows you to preview the corners, but also generates all the code for you.

3. ColorZilla

ColorZilla ia a browser plugin for Firefox and Chrome that enables you to use an “eyedropper” anywhere on the web. The hex code automatically copies to your clipboard whenever you pick a color, making it easy to paste into Photoshop or your HTML editor. ColorZilla also comes with a built-in color browser for quick reference and a shortcut link to a code generator for background gradients.

4. Pixel to EM

EM is the unit of measurement that ensures every browser and device displays text size consistently. Just as the title says, this tool is a pixel-to-EM converter that translates a pixel measurement to EM for you. It also provides a chart with the most common sizes and percentages. No more fancy equations!

5. WordOff

Sometimes, when you copy text from a Word document or existing webpage and paste it into a WYSISYG editor (like WordPress), an annoying thing happens where snippets of unwanted HTML tags appear in the code and you end up with the meticulous chore of hunting for and deleting each one. Paste the messy code into WordOff and it will remove the tags for you.

Post by Jen Tabangcura
Zer0 to 5ive Developer