HIG is Autodesk's unified design system, so we can build better products faster.
Add a component to your app:
yarn add @hig/buttonImport and render the component:
import Button from '@hig/button';
import '@hig/button/build/index.css';
function MyComponent() {
return <Button title="Hello, world!" />
}- Typography - typography and rich text
- Layout - spacer and grid
- Icons
Each HIG pattern is implemented as a set of React components. Each pattern is published to NPM individually under the @hig namespace, to allow you to import only what you'll use.
<Avatar>- A visual representation of a customer's identity<Banner>- An alert that requires a user action<Button>- Trigger actions or changes<Checkbox>- A control to select from non-exclusive options<Dropdown>- A menu to select one or many from a list<Flyout>- A lightweight popup container<Icon>- Represents a concept in graphical form<IconButton>- Action buttons that include an icon only<Modal>- An overlay that focuses the customer's attention<ProfileFlyout>- A flyout containing customer's name, email, and account info<ProgressBar>- An indication of content loading, presented horizontally<ProgressRing>- An indication of content loading, presented circularly<ProjectAccountSwitcher>- Switches the context to different projects or accounts<RadioButton>- A control to select one exclusively from a list<RichText>- Applies the HIG typography styles to whatever is passed to it<SideNav>- Provides high-level navigation<SkeletonItem>- A placeholder for loading content<Slider>- A control for selecting a single numeric value from a range<Table>- Represents tabular data in columns and rows<Tabs>- Keeps related content in a single container<TextArea>- A control to provide a large amount of freeform text<TextField>- A control to provide a small amount of freeform text<TextLink>- Directs visitors to another location<Timestamp>- Presents a date with humanized phrasing<Tooltip>- Provides context in a small popup container<TopNav>- Navigation across the top of the screen<Typography>- A set of components in many typographical variations
Read our contribution guidelines here: CONTRIBUTING.md