New to Telerik UI for ASP.NET Core? Download free 30-day trial

Snippets in Visual Studio Code

Visual Studio Code snippets are templates that make it easier to enter repetitive code patterns. Use the Telerik UI for ASP.NET Core code snippets for fast declaration of components with their most used features.

Telerik UI for ASP.NET Core Snippets

The Telerik UI for ASP.NET Core Visual Studio Code Productivity Tools provide snippets for the components listed in the table below in both flavors—HTML Helpers and Tag Helpers.

  1. Type tc—short for Telerik UI for ASP.NET Core—or the name of component you wish to add.

    UI for ASP.NET Core review the suggested snippet templates

  2. Select the desired snippet from the list and press Enter to generate the component configuration.

    UI for ASP.NET Core use the generated code snippet

You can access the code snippets pack by installing the Telerik UI for ASP.NET Core Visual Studio Code productivity extension.

Component Html Helper snippet TagHelper snippet
Barcodes
Barcode tc-barcode-html tc-barcode-tag
QRCode tc-qrcode-html tc-qrcode-tag
Charts
Chart tc-chart-html tc-chart-tag
Chart DataSource Binding tc-chartremotedata-html tc-chartremotedata-tag
Conversational UI
Chat tc-chat-html tc-chat-tag
Data Management
FileManager tc-filemanager-html tc-filemanager-tag
Filter tc-filter-html tc-filter-tag
Grid tc-grid-html tc-grid-tag
Bound Grid Column tc-gridcolumn-html tc-gridcolumn-tag
Sticky Grid Column tc-gridcolumn-sticky-html tc-gridcolumn-sticky-tag
Frozen Grid Column tc-gridcolumn-frozen-html tc-gridcolumn-frozen-tag
ListView tc-listview-html
Pager tc-pager-html tc-pager-tag
PivotGrid tc-pivotgrid-html tc-pivotgrid-tag
PivotGridV2 tc-pivotgridv2-html tc-pivotgridv2-tag
Spreadsheet tc-spreadsheet-html tc-spreadsheet-tag
Spreadsheet DataSource Binding tc-spreadsheetremotedata-html
TaskBoard tc-taskboard-html tc-taskboard-tag
TreeList tc-treelist-html tc-treelist-tag
Add TreeList Column tc-treelistcolumn-html tc-treelistcolumn-tag
Diagrams and Maps
Diagram tc-diagram-html
Map tc-map-html tc-map-tag
OrgChart tc-orgchart-html tc-orgchart-tag
Editors
AutoComplete tc-autocomplete-html tc-autocomplete-tag
Captcha tc-captcha-html tc-captcha-tag
CheckBox tc-checkbox-html tc-checkbox-tag
CheckBoxGroup tc-checkboxgroup-html tc-checkboxgroup-tag
ColorGradient tc-colorgradient-html tc-colorgradient-tag
ColorPalette tc-colorpalette-html tc-colorpalette-tag
ColorPicker tc-colorpicker-html tc-colorpicker-tag
ComboBox tc-combobox-html tc-combobox-tag
DateInput tc-dateinput-html tc-dateinput-tag
DatePicker tc-datepicker-html tc-datepicker-tag
DateRangePicker tc-daterangepicker-html tc-daterangepicker-tag
DateTimePicker tc-datetimepicker-html tc-datetimepicker-tag
DropDownList tc-dropdownlist-html tc-dropdownlist-tag
DropDownTree tc-dropdowntree-html tc-dropdowntree-tag
Editor tc-editor-html tc-editor-tag
FlatColorPicker tc-flatcolorpicker-html tc-flatcolorpicker-tag
ImageEditor tc-imageeditor-html tc-imageeditor-tag
ListBox tc-listbox-html tc-listbox-tag
MaskedTextBox tc-maskedtextbox-html tc-maskedtextbox-tag
MultiColumnComboBox tc-multicolumncombobox-html tc-multicolumncombobox-tag
MultiSelect tc-multiselect-html tc-multiselect-tag
NumericTextBox tc-numerictextbox-html tc-numerictextbox-tag
RadioGroup tc-radiogroup-html tc-radiogroup-tag
Rating tc-rating-html tc-rating-tag
Slider tc-slider-html tc-slider-tag
Switch tc-switch-html tc-switch-tag
TextArea tc-textarea-html tc-textarea-tag
TextBox tc-textbox-html tc-textbox-tag
TimePicker tc-timepicker-html tc-timepicker-tag
Upload tc-upload-html tc-upload-tag
Gauges
ArcGauge tc-arc-gauge-html tc-arc-gauge-tag
CircularGauge tc-circular-gauge-html tc-circular-gauge-tag
LinearGauge tc-linear-gauge-html tc-linear-gauge-tag
RadialGauge tc-radial-gauge-html tc-radial-gauge-tag
Interactivity and UX
Circular ProgressBar tc-circular-progress-bar-html tc-circular-progress-bar-tag
Loader tc-loader-html tc-loader-tag
ProgressBar tc-progressbar-html tc-progressbar-tag
SkeletonContainer tc-skeletoncontainer-html tc-skeletoncontainer-tag
Sortable tc-sortable-html tc-sortable-tag
Layout
Avatar tc-avatar-html tc-avatar-tag
Badge tc-badge-html tc-badge-tag
Dialog tc-dialog-html tc-dialog-tag
ExpansionPanel tc-expansionpanel-html tc-expansionpanel-tag
Form tc-form-html tc-form-tag
Form Item tc-formitem-html tc-formitem-tag
Notification tc-notification-html tc-notification-tag
PopOver tc-popover-html tc-popover-tag
ResponsivePanel tc-responsivepanel-html tc-responsivepanel-tag
Splitter tc-splitter-html tc-splitter-tag
TileLayout tc-tilelayout-html tc-tilelayout-tag
Tooltip tc-tooltip-html tc-tooltip-tag
Window tc-window-html tc-window-tag
Media
MediaPlayer tc-mediaplayer-html
ScrollView tc-scrollview-html tc-scrollview-tag
Navigation
ActionSheet tc-actionsheet-html tc-actionsheet-tag
AppBar tc-appbar-html tc-appbar-tag
BottomNavigation tc-bottomnavigation-html tc-bottomnavigation-tag
BottomNavigation Item tc-bottomnavigationitem-html tc-bottomnavigationitem-tag
Breadcrumb tc-breadcrumb-html tc-breadcrumb-tag
Button tc-button-html tc-button-tag
ButtonGroup tc-buttongroup-html tc-buttongroup-tag
Drawer tc-drawer-html tc-drawer-tag
DropDownButton tc-dropdownbutton-html tc-dropdownbutton-tag
DropDownButton Item tc-dropdownbuttonitem-html tc-dropdownbuttonitem-tag
FloatingActionButton tc-floatingactionbutton-html tc-floatingactionbutton-tag
FloatingActionButton Items tc-floatingactionbutton-items-html tc-floatingactionbutton-items-tag
FloatingActionButton Item tc-floatingactionbuttonitem-html tc-floatingactionbuttonitem-tag
Menu tc-menu-html tc-menu-tag
Menu Item tc-menuitem-html tc-menuitem-tag
Menu DataSource Binding tc-menuremotedata-html tc-menuremotedata-tag
PanelBar tc-panelbar-html tc-panelbar-tag
PanelBar DataSource Binding tc-panelbarremotedata-html tc-panelbarremotedata-tag
RadioButton tc-radiobutton-html tc-radiobutton-tag
SplitButton tc-splitbutton-html tc-splitbutton-tag
Stepper tc-stepper-html tc-stepper-tag
TabStrip tc-tabstrip-html tc-tabstrip-tag
Timeline tc-timeline-html tc-timeline-tag
ToolBar tc-toolbar-html tc-toolbar-tag
TreeView tc-treeview-html tc-treeview-tag
Wizard tc-wizard-html tc-wizard-tag
PDF
PDFViewer tc-pdfviewer-html tc-pdfviewer-tag
Scheduling
Calendar tc-calendar-html tc-calendar-tag
Gantt tc-gantt-html tc-gantt-tag
MultiViewCalendar tc-multiviewcalendar-html tc-multiviewcalendar-tag
Scheduler tc-scheduler-html tc-scheduler-tag

For further details on using snipets, creating personalized snippets or disabling snippets refer to the official Visual Studio Code documentation.

In this article