As of March 2019, this repository is read-only as Salesforce has archived the FuelUX open-source UI framework and will no longer be supported.
- Sanity Checks
- Obtaining Fuel UX
- Bugs and Feature Requests
- Previous releases
More thorough documentation and guides available at http://getfuelux.com
Fuel UX documentation is built with Jekyll and publicly hosted on GitHub Pages at http://getfuelux.com. More details on setting up Jekyll and running docs locally can be found in our CONTRIBUTING.md documentation.
Please read the CONTRIBUTING.md first.
Obtaining Fuel UX
NPM is the recommended method for obtaining Fuel UX.
npm install fuelux
You can also use on of the following methods:
bower install fuelux(update with
bower update fuelux).
volo add fuelux(update with
volo add -f fuelux).
- Clone via git
git clone https://github.com/ExactTarget/fuelux/
- Cloning the repository ensures you can apply future updates to Fuel UX easily, but requires to you manage its dependencies on your own.
- Download a .zip archive.
Using Fuel UX
Fuel UX can be used with an existing page via CDN or installed in a project.
Read the Getting started page for more detailed information on the framework contents, templates, examples, and more.
Required fuelux class
fuelux class to the portion of the page using Fuel UX, usually the body.
For other methods of managing dependencies consider AMD support via require.
Ensure all the dependencies are included on the page (eg, such as using the CDN as shown below).
<link href="//maxcdn.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap.min.css" rel="stylesheet"> <link href="//www.fuelcdn.com/fuelux/3.17.1/css/fuelux.min.css" rel="stylesheet"> <script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.js"></script> <script src="//maxcdn.bootstrapcdn.com/bootstrap/3.2.1/js/bootstrap.min.js"></script> <script src="//www.fuelcdn.com/fuelux/3.17.1/js/fuelux.min.js"></script>
The code you want is in
dist/. We provide compiled CSS and JS (like
fuelux.*), as well as compiled and minified CSS and JS (like
fuelux.min.*) in the
dist folder. Icons are provided as fonts.
fuelux/ ├── css/ │ ├── fuelux.css │ ├── fuelux.min.css ├── js/ │ ├── fuelux.js │ └── fuelux.min.js └── fonts/ ├── fuelux.eot ├── fuelux.svg ├── fuelux.ttf └── fuelux.woff
We recommend only loading the controls you need (eg
If using AMD (such as RequireJS), reference the FuelUX directory in your paths configuration, wherever it is located:
Then list any individual fuel ux controls needed as dependencies within your application modules:
In instances where you require every module from Fuel UX, you can use
fuelux/all instead of listing each module individually.
Fuel UX also supports placing components in their own
Bugs and Feature Requests
For additional assistance connect with the community.
Our aim is to provide a suite of related but independent projects that help web developers integrate, manage, and customize quality libraries and utilities to more efficiently develop, maintain, test, and distribute their projects. Any improvements or fixes we make to the open source projects, we use will be contributed upstream if they are useful to the rest of the community.
Thank you to all those that have submitted issues and contributed to this library.
Copyright and License
Copyright © 2012-2014 Salesforce Marketing Cloud, Inc.
View BSD-3 license.