# RayCraft

> Blazor and native Android controls for business applications. Every control has its own page with a plain-language summary and, for most controls, a short code example. RayCraft does not include AI components; this file only helps assistants and search tools find accurate pages.

## Start here

- [Documentation](https://raycraft.dev/raycraft-docs): installation, every control with a short summary
- [Get started](https://raycraft.dev/raycraft-get-started): setup steps and a code sample
- [Controls](https://raycraft.dev/raycraft-controls): all controls by group
- [Pricing](https://raycraft.dev/raycraft-pricing): RayCraft Free is available from 7 November 2026, RayCraft Complete is coming soon
- [Examples](https://github.com/RayCraftUI/RayCraft): public example and demo code (MIT), not the library code

## Buttons

- [Button](https://raycraft.dev/raycraft-controls/button): The button your whole app builds on: three styles, six colors, icons, and protection against double clicks.
- [IconButton](https://raycraft.dev/raycraft-controls/icon-button): A compact button for toolbars, with an accessible name built in.
- [ButtonGroup](https://raycraft.dev/raycraft-controls/button-group): Join related actions into one tidy control, ready for view switchers.
- [ToggleButton](https://raycraft.dev/raycraft-controls/toggle-button): A button that stays on or off.
- [SplitButton](https://raycraft.dev/raycraft-controls/split-button): A main action with related actions one click away.
- [FloatingActionButton](https://raycraft.dev/raycraft-controls/floating-action-button): Keep the main action always within reach.
- [SpeedDial](https://raycraft.dev/raycraft-controls/speed-dial): A floating button that opens a short list of actions.
- [ProgressButton](https://raycraft.dev/raycraft-controls/progress-button): A button that shows its own progress while work is running.
- [CopyButton](https://raycraft.dev/raycraft-controls/copy-button): One click to copy, with a clear confirmation.

## Text And Numbers

- [TextField](https://raycraft.dev/raycraft-controls/text-field): The text box your forms are built on, with validation messages below.
- [NumericField](https://raycraft.dev/raycraft-controls/numeric-field): Number entry that respects limits and your users' format.
- [PercentField](https://raycraft.dev/raycraft-controls/percent-field): Type percentages naturally while the value stays a clean fraction.
- [MoneyField](https://raycraft.dev/raycraft-controls/money-field): Type amounts the way your users write them, in their own culture.
- [MaskedInput](https://raycraft.dev/raycraft-controls/masked-input): Guide people to type phone numbers, codes and IDs in the right format.
- [OtpInput](https://raycraft.dev/raycraft-controls/otp-input): One box per character for verification codes, with smooth typing and pasting.
- [SearchBox](https://raycraft.dev/raycraft-controls/search-box): Search with an icon, a clear button and your own search action.
- [PasswordStrength](https://raycraft.dev/raycraft-controls/password-strength): Show people how strong a password is and which rules it meets.
- [InPlaceEditor](https://raycraft.dev/raycraft-controls/in-place-editor): Edit a value right where it is shown: click, change, save.

## List Selection

- [Select](https://raycraft.dev/raycraft-controls/select): Choose one item from a drop-down, for any type of value.
- [DropDownList](https://raycraft.dev/raycraft-controls/drop-down-list): Pick from lists of any length, even hundreds of thousands of entries, without slowdowns.
- [MultiSelect](https://raycraft.dev/raycraft-controls/multi-select): Choose several items from a drop-down, with Select all and Clear.
- [ListBox](https://raycraft.dev/raycraft-controls/list-box): A list that is always visible, for one choice or several.
- [Autocomplete](https://raycraft.dev/raycraft-controls/autocomplete): Get people to the right answer faster by narrowing a long list while they type.
- [MultiColumnComboBox](https://raycraft.dev/raycraft-controls/multi-column-combo-box): Search a list that shows several columns at once.
- [Cascader](https://raycraft.dev/raycraft-controls/cascader): Let users choose from a hierarchy, one level at a time.
- [DropDownTree](https://raycraft.dev/raycraft-controls/drop-down-tree): Choose one node of a hierarchy from a compact drop-down.
- [TagInput](https://raycraft.dev/raycraft-controls/tag-input): Add free-form tags with Enter or a comma.
- [Mention](https://raycraft.dev/raycraft-controls/mention): Tag colleagues with @ right inside a text box.

## Sliders And Rating

- [Slider](https://raycraft.dev/raycraft-controls/slider): Choose a number by dragging.
- [RangeSlider](https://raycraft.dev/raycraft-controls/range-slider): Choose a lower and an upper value with one control.
- [RangeSelector](https://raycraft.dev/raycraft-controls/range-selector): Pick an interval of a data series with two handles.
- [Rating](https://raycraft.dev/raycraft-controls/rating): Collect star ratings with a single click.
- [RatingDisplay](https://raycraft.dev/raycraft-controls/rating-display): Show ratings with half stars, a score and a review count.

## Color And File

- [ColorPicker](https://raycraft.dev/raycraft-controls/color-picker): Let users choose colors with a picker, a hex code or ready presets.
- [ColorPalette](https://raycraft.dev/raycraft-controls/color-palette): A grid of swatches that is quick to scan and easy to use with the keyboard.
- [ColorButton](https://raycraft.dev/raycraft-controls/color-button): A familiar toolbar color button that always shows the chosen color.
- [FileUpload](https://raycraft.dev/raycraft-controls/file-upload): Drag and drop or pick files, with size and type checks built in.
- [SignaturePad](https://raycraft.dev/raycraft-controls/signature-pad): Collect handwritten signatures with a mouse, finger or pen.

## Editors

- [MarkdownEditor](https://raycraft.dev/raycraft-controls/markdown-editor): Write Markdown with a toolbar and a live preview.
- [AddressField](https://raycraft.dev/raycraft-controls/address-field): Let people address a message in seconds: every address becomes a clear chip, with suggestions as they type.

## Choice

- [Checkbox](https://raycraft.dev/raycraft-controls/checkbox): A simple yes or no that works with your forms and validation.
- [CheckboxGroup](https://raycraft.dev/raycraft-controls/checkbox-group): Let users pick several items from a list, clearly labelled.
- [Radio](https://raycraft.dev/raycraft-controls/radio): A single option of a radio group, for when each choice needs its own label or content.
- [RadioGroup](https://raycraft.dev/raycraft-controls/radio-group): One clear choice from a short list.
- [Switch](https://raycraft.dev/raycraft-controls/switch): A clear on and off toggle.
- [Chip](https://raycraft.dev/raycraft-controls/chip): Compact labels for tags and filters, removable when you need it.
- [ChipSet](https://raycraft.dev/raycraft-controls/chip-set): Turn chips into filters people can select, one or several at a time.
- [ToggleGroup](https://raycraft.dev/raycraft-controls/toggle-group): A segmented control for view switchers and choices.
- [TransferList](https://raycraft.dev/raycraft-controls/transfer-list): Move items between two lists to choose a subset.

## Date Time

- [Calendar](https://raycraft.dev/raycraft-controls/calendar): A calendar that fits right into your pages, in your users' language.
- [DatePicker](https://raycraft.dev/raycraft-controls/date-picker): Pick a date from a calendar, in the language and format your users know.
- [DateTimePicker](https://raycraft.dev/raycraft-controls/date-time-picker): Choose a date and time in one field.
- [DateTimeRangePicker](https://raycraft.dev/raycraft-controls/date-time-range-picker): Select a period on one calendar showing two months, with quick ranges.
- [MonthPicker](https://raycraft.dev/raycraft-controls/month-picker): Choose a month and year without picking a day.
- [YearPicker](https://raycraft.dev/raycraft-controls/year-picker): Choose a year from a clear grid.
- [WeekPicker](https://raycraft.dev/raycraft-controls/week-picker): Choose a whole week in one click.
- [TimeField](https://raycraft.dev/raycraft-controls/time-field): A time box in the format of the user's language.
- [TimePicker](https://raycraft.dev/raycraft-controls/time-picker): Enter a time in the format your users expect.
- [TimeRangePicker](https://raycraft.dev/raycraft-controls/time-range-picker): Choose a start and an end time in one field.
- [TimeSpanPicker](https://raycraft.dev/raycraft-controls/time-span-picker): Enter a duration in days, hours, minutes and seconds.
- [EventCalendar](https://raycraft.dev/raycraft-controls/event-calendar): A month view with events that people can read at a glance.

## Forms

- [ErrorSummary](https://raycraft.dev/raycraft-controls/error-summary): Collect every form error in one clear place.
- [FormLayout](https://raycraft.dev/raycraft-controls/form-layout): Arrange labels and fields in a responsive grid with titled sections.
- [FormState](https://raycraft.dev/raycraft-controls/form-state): Lock or freeze a whole form with a single setting.
- [LoginForm](https://raycraft.dev/raycraft-controls/login-form): A ready sign-in form with friendly validation.
- [RegisterForm](https://raycraft.dev/raycraft-controls/register-form): A ready registration form with friendly validation.
- [Captcha](https://raycraft.dev/raycraft-controls/captcha): A light first check against simple bots, with no external service.
- [FormBuilder](https://raycraft.dev/raycraft-controls/form-builder): Build forms from a list of field definitions instead of markup.

## Layout

- [Container](https://raycraft.dev/raycraft-controls/container): Keep content at a comfortable width on every screen.
- [Stack](https://raycraft.dev/raycraft-controls/stack): Lay out items in a row or column with even spacing.
- [Grid](https://raycraft.dev/raycraft-controls/grid): A 12-column grid that changes with the screen size.
- [GridItem](https://raycraft.dev/raycraft-controls/grid-item): One cell of the grid, with its width for every screen size set by a few simple values.
- [Spacer](https://raycraft.dev/raycraft-controls/spacer): Push items to the far end of a row.
- [Divider](https://raycraft.dev/raycraft-controls/divider): A thin line that gives content room to breathe.
- [Card](https://raycraft.dev/raycraft-controls/card): A clean container that groups related content with a header and footer.
- [Panel](https://raycraft.dev/raycraft-controls/panel): A titled section that can collapse and carry its own actions.
- [Fieldset](https://raycraft.dev/raycraft-controls/fieldset): Group related fields under a clear heading.
- [Toolbar](https://raycraft.dev/raycraft-controls/toolbar): A row of tools, ready for the keyboard.
- [Splitter](https://raycraft.dev/raycraft-controls/splitter): Resizable panes that users can adjust by mouse, touch or keyboard.
- [Accordion](https://raycraft.dev/raycraft-controls/accordion): Keep long pages tidy: show one section at a time, or several if your users prefer.
- [Collapse](https://raycraft.dev/raycraft-controls/collapse): Show details only when users ask for them.
- [TagCloud](https://raycraft.dev/raycraft-controls/tag-cloud): Show words in sizes that follow their importance.
- [TitleIndex](https://raycraft.dev/raycraft-controls/title-index): A list grouped by first letter with a quick letter bar.

## Navigation

- [AppBar](https://raycraft.dev/raycraft-controls/app-bar): A clean top bar that adapts from wide desktops to small phones.
- [Drawer](https://raycraft.dev/raycraft-controls/drawer): A side panel for navigation or details that stays out of the way.
- [NavMenu](https://raycraft.dev/raycraft-controls/nav-menu): Vertical navigation that highlights the current page.
- [NavItem](https://raycraft.dev/raycraft-controls/nav-item): One link in the navigation menu, with an icon and a label, highlighted when its page is open.
- [NavGroup](https://raycraft.dev/raycraft-controls/nav-group): A collapsible group of links in the navigation menu, so long menus stay easy to scan.
- [Tabs](https://raycraft.dev/raycraft-controls/tabs): Organize content into panels users can switch between.
- [Stepper](https://raycraft.dev/raycraft-controls/stepper): Guide users through a process one step at a time.
- [Wizard](https://raycraft.dev/raycraft-controls/wizard): Guide users through a process with steps that can be checked or skipped.
- [Breadcrumbs](https://raycraft.dev/raycraft-controls/breadcrumbs): Always show where the user is and give a one-click way back.
- [Menu](https://raycraft.dev/raycraft-controls/menu): A button that opens a clear list of actions.
- [MenuItem](https://raycraft.dev/raycraft-controls/menu-item): One entry in a menu, with an optional icon, ready for the keyboard and the mouse.
- [ContextMenu](https://raycraft.dev/raycraft-controls/context-menu): Put the right actions under the right mouse button.
- [MenuBar](https://raycraft.dev/raycraft-controls/menu-bar): A classic application menu bar with shortcuts and submenus.
- [CommandContextMenu](https://raycraft.dev/raycraft-controls/command-context-menu): Right-click menus with shortcuts, check marks and submenus, built from one list of commands.
- [TextContextMenu](https://raycraft.dev/raycraft-controls/text-context-menu): A familiar right-click menu for text fields.
- [ProfileMenu](https://raycraft.dev/raycraft-controls/profile-menu): Show the signed-in user with an avatar, name and menu.
- [Pagination](https://raycraft.dev/raycraft-controls/pagination): Move through long lists page by page.
- [TreeView](https://raycraft.dev/raycraft-controls/tree-view): Hierarchies that are easy to browse by keyboard or mouse.
- [ScrollSpy](https://raycraft.dev/raycraft-controls/scroll-spy): A contents list that follows the reader through a long page.

## Overlays

- [Dialog](https://raycraft.dev/raycraft-controls/dialog): Focused dialogs that keep users on track and work with the keyboard.
- [DialogHost](https://raycraft.dev/raycraft-controls/dialog-host): The place where dialogs appear.
- [Popover](https://raycraft.dev/raycraft-controls/popover): A floating panel for extra detail, close at hand.
- [Tooltip](https://raycraft.dev/raycraft-controls/tooltip): A short hint on hover or focus, without a script.
- [Overlay](https://raycraft.dev/raycraft-controls/overlay): Dim the page to focus attention.
- [Lightbox](https://raycraft.dev/raycraft-controls/lightbox): A full-screen viewer for images, with previous and next buttons, arrow keys and Escape.
- [Tour](https://raycraft.dev/raycraft-controls/tour): Guide new users through your app step by step.
- [ColorDialog](https://raycraft.dev/raycraft-controls/color-dialog): Ask the user for a color in a ready dialog, in one line of code.
- [FontDialog](https://raycraft.dev/raycraft-controls/font-dialog): Ask the user for a font in a ready dialog, in one line of code.
- [SnackbarHost](https://raycraft.dev/raycraft-controls/snackbar-host): The place where short messages appear.

## Feedback

- [Alert](https://raycraft.dev/raycraft-controls/alert): Say what matters, in the right tone: clear messages for success, warnings and errors.
- [Badge](https://raycraft.dev/raycraft-controls/badge): A small status label that makes state obvious in lists and menus.
- [BusyOverlay](https://raycraft.dev/raycraft-controls/busy-overlay): Keep users informed while something loads, and stop accidental clicks.
- [CookieConsent](https://raycraft.dev/raycraft-controls/cookie-consent): Ask for cookie choices politely and remember the answer.
- [EmptyState](https://raycraft.dev/raycraft-controls/empty-state): Turn an empty page into a helpful next step.
- [NotificationCenter](https://raycraft.dev/raycraft-controls/notification-center): A bell with an unread count and a panel of notifications.
- [ProgressBar](https://raycraft.dev/raycraft-controls/progress-bar): Show how far along something is.
- [ProgressCircular](https://raycraft.dev/raycraft-controls/progress-circular): A ring that shows progress at a glance.
- [ResultPage](https://raycraft.dev/raycraft-controls/result-page): Tell users how it went: success, error, not found or no access.
- [Skeleton](https://raycraft.dev/raycraft-controls/skeleton): Placeholders that make loading feel quicker.
- [SkeletonPreset](https://raycraft.dev/raycraft-controls/skeleton-preset): Ready-made loading placeholders for cards, lists, tables and profiles.
- [Spinner](https://raycraft.dev/raycraft-controls/spinner): A clear sign that something is loading.

## Content

- [Typography](https://raycraft.dev/raycraft-controls/typography): Headings and text that stay consistent across your app.
- [Icon](https://raycraft.dev/raycraft-controls/icon): A consistent library of icons in one clean style.
- [Image](https://raycraft.dev/raycraft-controls/image): Images with required alternative text, captions and lazy loading.
- [ImageGallery](https://raycraft.dev/raycraft-controls/image-gallery): A thumbnail grid that opens into a full-screen viewer.
- [Avatar](https://raycraft.dev/raycraft-controls/avatar): Put a face or initials next to every name and make lists feel personal.
- [AvatarGroup](https://raycraft.dev/raycraft-controls/avatar-group): Show a whole team in a small space, with a simple +n for the rest.
- [Link](https://raycraft.dev/raycraft-controls/link): Links that look right and handle external addresses safely.
- [Statistic](https://raycraft.dev/raycraft-controls/statistic): Big numbers with a label and trend, built for dashboards.
- [Descriptions](https://raycraft.dev/raycraft-controls/descriptions): Show the details of a record in a neat grid that fits small screens too.
- [Timeline](https://raycraft.dev/raycraft-controls/timeline): Tell the story of a record as a vertical sequence of events.
- [Carousel](https://raycraft.dev/raycraft-controls/carousel): Present highlights as slides, with controls people can pause.
- [Countdown](https://raycraft.dev/raycraft-controls/countdown): Count down to a launch, a deadline or an offer.
- [Highlighter](https://raycraft.dev/raycraft-controls/highlighter): Mark search matches inside text so users find them instantly.
- [Marquee](https://raycraft.dev/raycraft-controls/marquee): A scrolling strip for short announcements that users can pause.
- [CodeBlock](https://raycraft.dev/raycraft-controls/code-block): Show code readably, with light syntax coloring.
- [Markdown](https://raycraft.dev/raycraft-controls/markdown): Display Markdown text beautifully, with safe handling of links and HTML.
- [QrCode](https://raycraft.dev/raycraft-controls/qr-code): Create QR codes in your page, with no image service.
- [Barcode](https://raycraft.dev/raycraft-controls/barcode): Print scannable barcodes straight from your app, no image service needed.
- [PricingTable](https://raycraft.dev/raycraft-controls/pricing-table): Plan cards with prices, features and a monthly or yearly switch.
- [CommentThread](https://raycraft.dev/raycraft-controls/comment-thread): Add discussions to any record, with replies and a box for new comments.
- [ActivityFeed](https://raycraft.dev/raycraft-controls/activity-feed): Show who did what and when, grouped by day, so teams always know what changed.

## Light Data

- [Table](https://raycraft.dev/raycraft-controls/table): A neat table for simple, static data.
- [List](https://raycraft.dev/raycraft-controls/list): Lists with icons, two lines of text and actions on each row.
- [Repeater](https://raycraft.dev/raycraft-controls/repeater): Show a list with your own template, header and empty message.
- [VirtualList](https://raycraft.dev/raycraft-controls/virtual-list): Scroll hundreds of thousands of items smoothly.
- [PropertyGrid](https://raycraft.dev/raycraft-controls/property-grid): Edit the properties of any object in a tidy grouped list.

## Drag

- [Sortable](https://raycraft.dev/raycraft-controls/sortable): Let users reorder a list by dragging or with buttons.

## Preferences

- [ThemeToggle](https://raycraft.dev/raycraft-controls/theme-toggle): Switch between light and dark themes with one click.
- [ThemeMenu](https://raycraft.dev/raycraft-controls/theme-menu): Let users pick a theme and density from one menu.
- [DensityToggle](https://raycraft.dev/raycraft-controls/density-toggle): Let users choose between the comfortable and compact density of the whole application.
- [LanguageToggle](https://raycraft.dev/raycraft-controls/language-toggle): Switch the language of the whole interface, English or Bulgarian, with one control.

## Utilities

- [BreakpointObserver](https://raycraft.dev/raycraft-controls/breakpoint-observer): Build layouts that react to the screen size with a single, simple signal.
- [Fullscreen](https://raycraft.dev/raycraft-controls/fullscreen): Let users enlarge charts, images or editors to the full screen.
- [Hotkey](https://raycraft.dev/raycraft-controls/hotkey): Add keyboard shortcuts that power users will love.
- [InfiniteScroll](https://raycraft.dev/raycraft-controls/infinite-scroll): Load more content as the reader reaches the end of a list.
- [ScrollToTop](https://raycraft.dev/raycraft-controls/scroll-to-top): A button that takes readers back to the top.