Introduction
An extension that allows you to add useful snippets of the most popular MDB 5 components to Visual Studio Code.
Note: Visual Studio Code is one of the most popular and best code editors that most MDB developers use. This is the editor we use and we sincerely recommend it.
Installation
- Launch Visual Studio Code
-
Go to extensions tab -
Ctrl-Shift-X(Windows, Linux) orCmd-Shift-X(OSX) - Search for 'MDB 5 Standard snippets'
- Choose the extension
- Install extension and reload Visual Studio Code
Additionally, check also:
GitHub repository VSC pageAvailable snippets
Fundamentals
| Snippet | Description |
|---|---|
s-mdb-html-starter |
MDB HTML starter |
s-mdb-basic-layout |
MDB Basic layout |
Layout
| Snippet | Description |
|---|---|
s-mdb-grid-2col |
MDB Grid 2 columns |
s-mdb-grid-3col |
MDB Grid 3 columns |
s-mdb-grid-4col |
MDB Grid 4 columns |
s-mdb-grid-centered |
MDB Grid centered column |
s-mdb-section |
MDB Section |
Content & styles
| Snippet | Description |
|---|---|
s-mdb-hover-effects |
MDB Hover effects |
s-mdb-icon |
MDB Icon |
s-mdb-note |
MDB Note |
Navigation
| Snippet | Description |
|---|---|
s-mdb-footer |
MDB Footer |
s-mdb-header-jumbotron |
MDB Header with jumbotron |
s-mdb-header-image |
MDB Header with image |
s-mdb-navbar |
MDB Navbar |
s-mdb-pagination |
MDB Pagination |
s-mdb-pills |
MDB Pills |
Components
| Snippet | Description |
|---|---|
s-mdb-button |
MDB Button |
s-mdb-button-link |
MDB Button link |
s-mdb-button-floating |
MDB Button floating |
s-mdb-button-social |
MDB Button social |
s-mdb-card |
MDB Card |
s-mdb-card-empty |
MDB Card empty |
s-mdb-card-image |
MDB Card image |
s-mdb-card-complex |
MDB Card complex |
s-mdb-list-group |
MDB List group |
s-mdb-list-icons-arrow |
MDB List with arrow icons |
s-mdb-list-icons-check |
MDB List with check icons |
s-mdb-list-icons-question |
MDB List with question icons |
s-mdb-modal |
MDB Modal |
Forms
| Snippet | Description |
|---|---|
s-mdb-form |
MDB Form |
s-mdb-checkbox |
MDB Checkbox |
s-mdb-radio |
MDB Radio |
s-mdb-input |
MDB Input |
s-mdb-textarea |
MDB Textarea |
Data
| Snippet | Description |
|---|---|
s-mdb-table |
MDB Table |
Utilities
| Snippet | Description |
|---|---|
s-mdb-embed |
MDB Embed |
s-mdb-ripple-color |
MDB Ripple color |
s-mdb-divider |
MDB Divider |