# semantic-ui

> Semantic empowers designers and developers by creating a shared vocabulary for UI.

Latest version **2.5.0** (published 2022-10-06) · MIT license · 0 weekly downloads

## Install

```sh
npm install semantic-ui
pnpm add semantic-ui
yarn add semantic-ui
bun add semantic-ui
```

## Health

**Score 28/100 (F)** — status: abandoned.

Positive: has types package; no vulnerabilities; popular repo; extremely popular.

Warnings: low downloads; no esm support; large bundle.

Negative: abandoned; low maintenance score.

## Facts

| | |
|---|---|
| Version | 2.5.0 |
| Published | 2022-10-06 |
| First published | 2014-06-25 |
| Weekly downloads | 0 |
| License | MIT |
| TypeScript types | separate (@types/semantic-ui) |
| Module format | CommonJS |
| Dependencies | 33 |
| Unpacked size | 12.6 MB |
| Known vulnerabilities | 0 |
| Install scripts | yes |
| GitHub stars | 51000 |
| Author | Jack Lukic |
| Maintainers | jlukic, semantic-bot |

## Links

- npm: https://www.npmjs.com/package/semantic-ui
- Repository: https://github.com/Semantic-Org/Semantic-UI
- Homepage: http://www.semantic-ui.com
- Issues: https://github.com/Semantic-Org/Semantic-UI/issues
- npm.io page: https://npm.io/package/semantic-ui

## Dependencies (33)

- [del](https://npm.io/package/del.md) *
- [gulp](https://npm.io/package/gulp.md) *
- [extend](https://npm.io/package/extend.md) *
- [jquery](https://npm.io/package/jquery.md) ^3.5.1
- [mkdirp](https://npm.io/package/mkdirp.md) ^1.0.4
- [yamljs](https://npm.io/package/yamljs.md) *
- [gulp-if](https://npm.io/package/gulp-if.md) *
- [gulp-copy](https://npm.io/package/gulp-copy.md) *
- [gulp-less](https://npm.io/package/gulp-less.md) *
- [gulp-chmod](https://npm.io/package/gulp-chmod.md) *
- [gulp-clone](https://npm.io/package/gulp-clone.md) *
- [gulp-print](https://npm.io/package/gulp-print.md) *
- [map-stream](https://npm.io/package/map-stream.md) *
- [prompt-sui](https://npm.io/package/prompt-sui.md) ^3.2.1
- [wrench-sui](https://npm.io/package/wrench-sui.md) ^0.0.3
- [gulp-concat](https://npm.io/package/gulp-concat.md) *
- [gulp-dedupe](https://npm.io/package/gulp-dedupe.md) *
- [gulp-header](https://npm.io/package/gulp-header.md) *
- [gulp-notify](https://npm.io/package/gulp-notify.md) *
- [gulp-rename](https://npm.io/package/gulp-rename.md) *
- [gulp-rtlcss](https://npm.io/package/gulp-rtlcss.md) *
- [gulp-uglify](https://npm.io/package/gulp-uglify.md) *
- [replace-ext](https://npm.io/package/replace-ext.md) *
- [gulp-flatten](https://npm.io/package/gulp-flatten.md) *
- [gulp-plumber](https://npm.io/package/gulp-plumber.md) *
- [gulp-replace](https://npm.io/package/gulp-replace.md) *
- [merge-stream](https://npm.io/package/merge-stream.md) ^1.0.0
- [better-console](https://npm.io/package/better-console.md) *
- [gulp-clean-css](https://npm.io/package/gulp-clean-css.md) *
- [gulp-concat-css](https://npm.io/package/gulp-concat-css.md) *
- [gulp-json-editor](https://npm.io/package/gulp-json-editor.md) ^2.5.4
- [require-dot-file](https://npm.io/package/require-dot-file.md) *
- [gulp-autoprefixer](https://npm.io/package/gulp-autoprefixer.md) *

## Recent versions

- 2.5.0 (latest) — 2022-10-06
- 2.4.2 — 2018-10-21
- 2.4.1 — 2018-10-13
- 2.4.0 — 2018-09-17
- 2.3.3 — 2018-07-09
- 2.3.2 — 2018-06-18
- 2.3.1 — 2018-03-19
- 2.3.0 — 2018-02-20
- 2.2.14 — 2018-01-29
- 2.2.13 — 2017-08-07
- 2.2.12 — 2017-08-07
- 2.2.11 — 2017-07-11
- 2.2.10 — 2017-03-28
- 2.2.9 — 2017-02-21
- 2.2.8 — 2017-02-21
- … 69 more at https://npm.io/package/semantic-ui/versions

## README

![Semantic](http://semantic-ui.com/images/logo.png)

# Semantic UI

[![Join the chat at https://gitter.im/Semantic-Org/Semantic-UI](https://badges.gitter.im/Join%20Chat.svg)](https://gitter.im/Semantic-Org/Semantic-UI?utm_source=badge&utm_medium=badge&utm_campaign=pr-badge&utm_content=badge)

[![CDNJS](https://img.shields.io/cdnjs/v/semantic-ui.svg)](https://cdnjs.com/libraries/semantic-ui/)

[Semantic](http://www.semantic-ui.com) is a UI framework designed for theming.

Key Features
* 50+ UI elements
* 3000 + CSS variables
* 3 Levels of variable inheritance (similar to SublimeText)
* Built with EM values for responsive design
* Flexbox friendly

Semantic allows developers to build beautiful websites fast, with **concise HTML**, **intuitive javascript**, and **simplified debugging**, helping make front-end development a delightful experience. Semantic is responsively designed allowing your website to scale on multiple devices. Semantic is production ready and partnered with frameworks such as **React**, **Angular**, **Meteor**, and **Ember**, which means you can integrate it with any of these frameworks to organize your UI layer alongside your application logic.

## 2.4.0 Release (Sep 17th, 2018)

Semantic UI `2.4` is now available. Read up on [what's new](http://www.semantic-ui.com/introduction/new.html) in the docs.

Migration info from `1.x` can be found in the [2.0 release notes](https://github.com/Semantic-Org/Semantic-UI/blob/master/RELEASE-NOTES.md#version-200---march-xx-2015)

## User Support

Please help us keep the issue tracker organized. For technical questions that do not include a specific [JSFiddle test case](https://jsfiddle.net/ca0rovs3/) (bug reports), or feature request please use [StackOverflow](http://stackoverflow.com/questions/tagged/semantic-ui) to find a solution.

Visit our [contributing guide](https://github.com/Semantic-Org/Semantic-UI/blob/master/CONTRIBUTING.md) for more on what should be posted to GitHub Issues.

## Install

#### Recommended Install
```bash
npm install semantic-ui  # Use themes, import build/watch tasks into your own gulpfile.
```

Semantic UI includes an interactive installer to help setup your project.

* For more details on setup visit our [getting started guide](http://semantic-ui.com/introduction/getting-started.html).
* To learn more about theming please read our [theming guide](http://www.semantic-ui.com/usage/theming.html)

#### Additional Versions

Environment | Install Script | Repo
--- | --- | --- |
CSS Only | `npm install semantic-ui-css` | [CSS Repo](https://github.com/Semantic-Org/Semantic-UI-CSS)
[LESS](https://github.com/less/less.js/) Only | `npm install semantic-ui-less` | [LESS Repo](https://github.com/Semantic-Org/Semantic-UI-LESS)
[LESS](https://github.com/less/less.js/) plugin | `npm install less-plugin-semantic-ui` | [LESS Plugin Repo](https://github.com/bassjobsen/less-plugin-semantic-ui/)
[EmberJS](http://emberjs.com/) | `ember install:addon semantic-ui-ember` | [Ember Repo](https://github.com/Semantic-Org/Semantic-UI-Ember)
|[Meteor](https://www.meteor.com/) - [LESS](https://github.com/less/less.js/) | `meteor add semantic:ui` | [Meteor Repo](https://github.com/Semantic-Org/Semantic-UI-Meteor) |
|[Meteor](https://www.meteor.com/) - CSS | `meteor add semantic:ui-css` | [CSS Repo](https://github.com/Semantic-Org/Semantic-UI-CSS) |
[Bower](http://bower.io/) | `bower install semantic-ui` |

Check out our [integration wiki](https://github.com/Semantic-Org/Semantic-UI/wiki/Integration) for more options.

#### Browser Support

* Last 2 Versions FF, Chrome, Safari Mac
* IE 11+
* Android 4.4+, Chrome for Android 44+
* iOS Safari 7+
* Microsoft Edge 12+

Although some components will work in IE9, [grids](http://semantic-ui.com/collections/grid.html) and other [flexbox](https://developer.mozilla.org/en-US/docs/Web/Guide/CSS/Flexible_boxes) components are not supported by IE9 and may not appear correctly.

## Community

#### Getting Help
Please **do not post** usage questions to GitHub Issues. For these types of questions use our [Gitter chatroom][Gitter.im Room] or [StackOverflow](http://stackoverflow.com/questions/tagged/semantic-ui).

#### Submitting Bugs and Enhancements
[GitHub Issues](https://github.com/Semantic-Org/Semantic-UI/issues) is for suggesting enhancements and reporting bugs. Before submiting a bug make sure you do the following:
* Check out our [contributing guide](https://github.com/Semantic-Org/Semantic-UI/blob/master/CONTRIBUTING.md) for info on our release cycle.
* [Fork this boilerplate JSFiddle](https://jsfiddle.net/ca0rovs3/) to create a test case for your bug. If a bug is apparent in the docs, that's ok as a test case, just make it clear exactly how to reproduce the issue. Only bugs that include a test case can be triaged.


#### Pull Requests

When adding pull requests, be sure to merge into the [next](https://github.com/Semantic-Org/Semantic-UI/tree/next) branch. If you need to demonstrate a fix in ``next`` release, you can use [this JSFiddle](https://jsfiddle.net/ca0rovs3/)


#### International

* **Chinese** A Chinese mirror site is available at [http://www.semantic-ui.cn](http://www.semantic-ui.cn).
* **Right-to-Left (RTL)** An RTL version can be created using our build tools by selecting `rtl` from the install script.
* **Translation** To help translate see the [Wiki Guide](https://github.com/Semantic-Org/Semantic-UI/wiki/Translating-Semantic-UI-Docs) for translations.

#### Resources

Resource | Description
--- | --- |
Bugs & Feature Requests |  All bug submission **require** a link to a test case, and a set of steps to reproduce the issue. You can make a test case by forking this [JSFiddle](https://jsfiddle.net/ca0rovs3/), then submit your [bug report on GitHub Issues](https://github.com/Semantic-Org/Semantic-UI/issues)
Live Chat | Join our [Gitter.im Room][Gitter.im Room]
Newsletter Updates | Sign up for updates at [semantic-ui.com](http://www.semantic-ui.com)
Additional Resources  | Submit a question on [StackOverflow](http://stackoverflow.com/questions/tagged/semantic-ui) or ask our [Google Group](https://groups.google.com/forum/#!forum/semantic-ui)

#### Places to Help

Project | How To Help | Next Step
--- | --- | --- |
Localization | Help us translate Semantic UI into your language | [Join our Translation Community](https://github.com/Semantic-Org/Semantic-UI/wiki/Translating-Semantic-UI-Docs)
[SCSS](http://sass-lang.com/) | SASS needs PR to support variables inside `@import` | [Add Pull Request](https://github.com/sass/sass/pulls) for [#739](https://github.com/sass/sass/issues/739#issuecomment-73984809)
[Angular](https://angularjs.org/) | Help develop angular bindings | Reach Out on [GitHub Issues](https://github.com/Semantic-Org/Semantic-UI-Angular/issues/8)
Guides & Tutorials | Help write guides and tutorials | [Join the discussion](https://github.com/Semantic-Org/Semantic-UI/issues/1571)

#### Reaching Out

If you'd like to start a conversation about Semantic feel free to e-mail me at [jack@semantic-ui.com](mailto:jack@semantic-ui.com)

<a href="http://packagequality.com/#?package=semantic-ui"><img src="http://npm.packagequality.com/badge/semantic-ui.png"/></a>

[Gitter.im Room]: https://gitter.im/Semantic-Org/Semantic-UI

---
_Source: https://npm.io/package/semantic-ui · Machine-readable twin of the npm.io package page. Health data is recomputed on every publish._