GettingStarted
Installation
Usage
theme
Minimizing Bundle Size
Layout
Box
Typography
Inputs
Button
Checkbox
Form
FormLabel
IconButton
Input
Radio
Select
Toggle
Navigation
Command
Drawer
Navigation
DataDisplay
Card
Item
ItemGroup
List
Table
Tabs
Tooltip
Feedback
Dialog
Progress
Spinner
Toast
Utils
Portal
Transition
Others
Color
Icon
react-hooks
guide
useAction
useClick
useClickOutside
useFocus
useGlobal
useHover
useMedia
useMessage
usePopper
useReveal
useTouch
useUpdateEffect
edit this page

Installation

Install Fluent-UI

Fluent-UI is available as an npm package.

Install

shell
// with npm
npm install @fluent-ui/core
// with yarn
yarn add @fluent-ui/core

Please note that react >= 16.8.0 and react-dom >= 16.8.0 are peer dependencies.

SVG Icons

In order to use prebuilt SVG Fluent icons, you must first install the @fluent-ui/icons package:

shell
// with npm
npm install @fluent-ui/icons
// with yarn
yarn add @fluent-ui/icons

CDN

Two Universal Module Definition (UMD) files are provided:

⚠️ Using this approach in production is discouraged though - the client has to download the entire library, regardless of which components are actually used, affecting performance and bandwidth utilization.