There are many online tools which makes the life of web developer much easier. Here we list 10 tools which help us time to time in our web development.
1. CSS Gradient Button Generator
CSSGradientButton gives you customizable options to create awesome CSS buttons with hovering effects in simple steps. Create the button of your choice with the CSS gradient button panel, get the code generated and paste it into your style sheet.
CSS Gradient Button
2. CSS Gradient Generator
It helps you generate CSS code online for the desired gradient in 3 steps.
- Create and control the gradient using the stop panel.
- Preview it on the preview panel.
- Obtain CSS code from the CSS panel.
CSS Gradient Generator
3. Border Radius Generator
Just input the top and bottom border radius in the 4 input boxes and get the ready to apply CSS code for your stylesheet.
CSS Border Radius Generator
4. Online Web font Testing
Using TypeWonder we can get a preview of web-fonts applied to our website by just entering the website url and choosing the desired font.
5. Color Picker
Choose your color from the picker and get the hex color code/rgb values easily. One can save the favorite colors.
A validator is a software program that can check your web pages against the web standards.
Using W3C validator we can check our HTML, XHTML or CSS documents, the validator returns a list of errors found, according to your chosen standard.
Using the jsonlint validator we can check the validity of our json code.If your json code is valid it returns the status valid,else it shows the errors found in your json code.
The following minifiers removes the comments and unnecessary whitespace from a program. Depending on how the program is written, this can reduce the size by about half.
dabblet is an interactive playground for quickly testing snippets of CSS ,HTML,Javascipt code.It uses prefix-free,so that we don’t have to add any prefixes in our CSS code.
An additional feature is if you hover over any bit of CSS code it will display the effect.eg: when you hover over the background color code it shows the individual color in a tooltip.
Also you can concentrate on the css and html result seperately since it provides you with options
>CSS & Result
>HTML & Result
CSS Html Js Test
9. Shorten your website url using bitly
We can shorten our website urls using bitly.Just input your website url and click go.We get the bitmark corresponding to our link which is the shortened version of your url ,making it easy to share and remember.
10. Website Speed Test Using Pingdom
Just input your webpage url and click go to get a detailed summary of your webpage loading time and performance.
Website Speed Test