Emmet installation in Sublime Text 3

Emmet makes coding faster in Sublime Text 3. Learn how to install, use & explore its features w/ an example.

Emmet Installation in Sublime Text 3

Emmet is an essential tool for web developers and designers. It speeds up the development workflow by allowing you to quickly write HTML and CSS code snippets and expand them into full-blown web pages. Sublime Text 3 is a popular text editor that supports Emmet, and here's how to install it:


// 1. Open Sublime Text 3
// 2. Go to Preferences -> Package Control
// 3. Click "Install Package"
// 4. Type "Emmet" and hit Enter
// 5. Restart Sublime Text 3
// 6. Emmet is now installed

Once installed, you can start using Emmet in Sublime Text 3. To do that, type an abbreviation in HTML or CSS and press the Tab key. For example, if you type the following abbreviation:


div#header>div.logo+ul#navigation>li*5>a

And press Tab, it will expand into the following HTML:


<div id="header">
    <div class="logo"></div>
    <ul id="navigation">
        <li><a href=""></a></li>
        <li><a href=""></a></li>
        <li><a href=""></a></li>
        <li><a href=""></a></li>
        <li><a href=""></a></li>
    </ul>
</div>

Emmet also provides a number of other features such as auto-completion, code snippets, and more. You can find more information on the official Emmet website.

That's it! You now have Emmet installed in Sublime Text 3 and can start developing faster and more efficiently.

Answers (0)