New to Telerik UI for Blazor? Download free 30-day trial

Code Snippets

The Telerik Visual Studio Code extension provides a handy feature for increased developer productivity – code snippets for fast UI component reference and configuration.

Get the Extension

To use the Telerik UI for Blazor Code Snippets, install the Telerik UI for Blazor Visual Studio Code Extension. You can get the extension from:

  • The Visual Studio Marketplace.

  • The Extensions tab in Visual Studio Code - search for Telerik UI for Blazor Productivity Tools, select the extension, and then click Install.

Add a Code Snippet to a .razor page

  1. Use the tb shortcut that stands for Telerik Blazor and select a snippet from the dropdown menu.
    1. Alternatively, type the component name, and the available snippets will appear in a dropdown menu.
  2. Use a Tab sequence to populate the available attributes of the component.

Add a code snippet to your .razor page

add a code snippet

Available Code Snippets

Code Snippet Component
tb-autocomplete AutoComplete
tb-autocomplete-filterable AutoComplete with Filtering
tb-barcode Barcode
tb-breadcrumb Breadcrumb
tb-button Button
tb-button-settings Button with Appearance Settings
tb-calendar Calendar
tb-carousel Carousel
tb-checkbox Checkbox
tb-checkbox-tristate Checkbox in Indeterminate State
tb-chunkprogressbar ChunkProgressBar
tb-colorgradient ColorGradient
tb-colorpalette ColorPalette
tb-colorpicker ColorPicker
tb-combobox ComboBox
tb-combobox-filterable ComboBox with Filtering
tb-contextmenu ContextMenu
tb-dateintput DateInput
tb-datepicker DatePicker
tb-daterangepicker DateRangePicker
tb-datetimepicker Date-Time Picker
tb-dialog Dialog
tb-drawer Drawer
tb-dropdownlist DropDownList
tb-dropdownlist-filterable DropDownList with Filtering
tb-editor Editor
tb-fileselect FileSelect
tb-filter Filter
tb-flatcolorpicker FlatColorPicker
tb-form Form
tb-gantt Gantt
tb-gantt-editable Gantt with Editing
tb-ganttcolumn Gantt - Databound Column
tb-grid Grid
tb-grid-editable Grid with Editing
tb-gridcolumn Grid - Databound Column
tb-gridcolumn-locked Grid with Frozen Column
tb-gridlayout GridLayout
tb-listview ListView
tb-listview-editable ListView with Editing
tb-loader Loader
tb-loadercontainer LoaderContainer
tb-maskedtextbox Masked Textbox
tb-menu Menu
tb-multiselect MultiSelect
tb-multiselect-filterable MultiSelect with Filtering
tb-numerictextbox Numeric Textbox
tb-pager Pager
tb-panelbar PanelBar
tb-progressbar ProgressBar
tb-qrcode QRCode
tb-radiogroup RadioGroup
tb-rangeslider RangeSlider
tb-scheduler Scheduler
tb-scheduler-editable Scheduler with Editing
tb-slider Slider
tb-splitter Splitter
tb-stacklayout StackLayout
tb-stepper Stepper
tb-switch Switch
tb-tabstrip TabStrip
tb-textarea TextArea
tb-textbox Textbox
tb-tilelayout TileLayout
tb-timepicker Time Picker
tb-togglebutton ToggleButton
tb-tooltip Tooltip
tb-treelist TreeList
tb-treeList-editable TreeList with Editing
tb-treelistcolumn TreeList - Databound Column
tb-treelistcolumn-locked TreeList with Frozen Column
tb-treeview TreeView
tb-upload Upload
tb-window Window
tb-wizard Wizard
In this article