Below are some commonly used plug-ins, tools, software, etc. for front-end development that I have compiled and collected. It is equivalent to making a small backup of the computer. As for how to use it, I will summarize it in the future. At present, it is better to google it yourself.
【FireFox plugin】
1. Firefbug - Page Moderator
2. YSlow - Web rating tool
3. pixel Perfect - Comparison of HTML and design draft
4. CSS Usage - CSS usage efficiency optimization tool
5. Page Speed - Quickly optimize web pages similar to YSlow
6. Measureit - Real-time measurement tool
7. Fiddler - Local Page Style Tool
8. DNS flusher - DNS refresh tool
9. Colorzilla - Real-time color selection tool
10. Web Developer - Check the relevant information of the web page
11. FireMobileSimulator - Simulate mobile phones
12. JavaScript Dubugger - JavaScript errors
13. Greasemonkey - Script applet
14. Firecookie - Cookie
【Chrome plugin】
1. Awesome Screenshot - Web page screenshot
2. user-Agent Switcher - Switch the display device
3. web Developer - Check the relevant information of the web page
4. Window Resizer - Change resolution
5. YSlow - Web rating tool
6. Browser compatibility detection
[Common URL Tools for Front-end Development]
Web color matching
http://www.peise.net/tools/web/
http://www.peise.net/tools/lilun/lilunxuexi.html
http://www.colorschemer.com/online.html
http://www.workwithcolor.com/hsl-color-picker-01.htm
CSS3 generator
http://www.css3maker.com/
http://www.flickyard.in/autocss3/
http://www.colorzilla.com/gradient-editor/
http://css3pie.com/
http://www.css3.me/
http://ie.microsoft.com/testdrive/Graphics/CSSGradientBackgroundMaker/
CSS3 Button Generator
http://www.wordpressthemeshock.com/css-drop-shadow/
http://css3buttongenerator.com/
CSS Picture Synthesizer
http://csssprites.com/
http://cn.spritegen.website-performance.org/
CSS code check
http://csslint.net/
ajax loading picture
http://ajaxload.info/
http://preloaders.net/
CSS hack table
http://centricle.com/ref/css/filters/
Browser Market
http://tongji.baidu.com/data/browser
Test the browser's support for CSS3
http://css3test.com/
http://kimblim.dk/css-tests/selectors/
http://selectivizr.com/
http://www.findmebyip.com/litmus
Detect user experience
http://gtmetrix.com/
CSS Template Generator
http://blog.html.it/layoutgala/
http://www.mycelly.com/
http://www.intensivstation.ch/en/templates/
CSS compression
http://www.csscompressor.com/
Common fonts for CSS
http://cssfontstack.com/
http://www.google.com/webfonts#
http://www.dafont.com/
CSS3 Transform
http://www.useragentman.com/IETransformsTranslator/
CSS3 Bezier Curve
http://cubic-bezier.com/#.47,.73,1,.41
YUI CSS grid tool
http://developer.yahoo.com/yui/grids/builder/
JavaScript code optimization and beautification
http://js.clicki.cc/
Code Demo
http://jsfiddle.net/
http://jsbin.com/#html,live
http://ikeeper.com/bar/20143449
http://codepad.org/
Prototyping Tools
https://gomockingbird.com/mockingbird/#
http://www.jotform.com/
【Local and commonly used software and IDE editor】
1. MarkMan - a designer, a must-have for front-end engineers
2. VIM - Super Fast Editor
3. Adobe PhotoShop CS6 - Picture cutting special
4. IE Tester - Check page compatibility
5. Fiddler2 - Detection request
6. Beyond Commpar - File comparison
7. GIT - Distributed Version Control
8. Opera Mobile Emulator - Mobile Browser
9. SimpLESS - LESS
Having mastered most of the above tools, congratulations, you are not far from an excellent front-end designer~~