```
const { Trigger, Content, Item } = Dropdown;
<div>
  <Dropdown variant="primary" className='dc'>
    <Trigger>
      Hello
    </Trigger>
    <Content maxItems="2" className="cc">
      <Item className="ic">hello hello hello hello</Item>
      <Item onClick={alert}>hello hello hello hello</Item>
      <Item>hello hello hello hello</Item>
      <Item>hello hello hello hello</Item>
    </Content>
  </Dropdown>

  <Dropdown variant="info">
    <Trigger>
      Hello
    </Trigger>
    <Content>
      <Item>hello hello hello hello</Item>
      <Item>hello hello hello hello</Item>
      <Item>hello hello hello hello</Item>
      <Item>hello hello hello hello</Item>
    </Content>
  </Dropdown>

  <Dropdown variant="warning">
    <Trigger>
      Hello
    </Trigger>
    <Content>
      <Item>hello hello hello hello</Item>
      <Item>hello hello hello hello</Item>
      <Item>hello hello hello hello</Item>
      <Item>hello hello hello hello</Item>
    </Content>
  </Dropdown>

  <Dropdown variant="alert">
    <Trigger>
      Hello
    </Trigger>
    <Content>
      <Item>hello hello hello hello</Item>
      <Item>hello hello hello hello</Item>
      <Item>hello hello hello hello</Item>
      <Item>hello hello hello hello</Item>
    </Content>
  </Dropdown>

  <Dropdown variant="dash-lagoon" size="nav-bar">
    <Trigger>
      Hello
    </Trigger>
    <Content>
      <Item>hello hello hello hello</Item>
      <Item>hello hello hello hello</Item>
      <Item>hello hello hello hello</Item>
      <Item>hello hello hello hello</Item>
    </Content>
  </Dropdown>
  <Dropdown variant="icon" size="nav-bar">
    <Trigger>
      <TextIcon size="xs" name="user">User name</TextIcon>
    </Trigger>
    <Content>
      <Item>hello hello hello hello</Item>
      <Item>hello hello hello hello</Item>
      <Item>hello hello hello hello</Item>
      <Item>hello hello hello hello</Item>
    </Content>
  </Dropdown>
  <Dropdown variant="launcher" size="nav-bar" reverse>
    <Trigger>
      <Icon size="sm" name="app-launcher" />
    </Trigger>
    <Content itemsPerRow={2}>
      <Item>
        <Title component='strong' level={5} withoutMarge strong>Sigfox</Title>
        <p>Sigfox description, nulla facilisi. Tristique tincidunt tellus condimentum.</p>
      </Item>
      <Item>
        <Title component='strong' level={5} withoutMarge strong>Partner Network</Title>
        <p>Partner Network description, nulla facilisi. Imperdiet dolor dapibus condimentum.</p>
      </Item>
      <Item>
        <Title component='strong' level={5} withoutMarge strong>Support</Title>
        <p>Support description, nulla facilisi. Phasellus tristique tincidunt tellus.</p>
      </Item>
      <Item>
        <Title component='strong' level={5} withoutMarge strong>Build</Title>
        <p>Build description, nulla facilisi. Eu imperdiet dolor dapibus condimentum.</p>
      </Item>
    </Content>
  </Dropdown>
</div>
```
