Futurico UI HTML – Free User Interface Elements for Developers
Futurico UI HTML is a web elements pack that has been created based on the free version of Futurico UI elements pack. We are really happy that Futurico UI was so successful and only in 3 months we have gathered about 100 000 tweets! This is something really big for us and we would like to thank you for your support and launch the Futurico UI HTML pack.
This pack of ready to use Futurico UI HTML components has been created for designers & developers. There is no need to reinvent the wheel cutting such huge pack yourself. Every component is tested in all the major browsers including IE8 and its newer version, Firefox, Chrome, Safari, Opera on Windows XP — 7 & Mac OSX. All the components fit the whole available space. This means you can set the width by using a grid, put any of the components into the grid and don’t care about setting width in pixels manually.
Futurico UI HTML is written using the SASS preprocessor. If you are not familiar with SASS you can use the CSS version instead. It would be quite hard to create this pack without having solid architecture & code style. The use of Scaffy guides helped organize all the components by small modular stylesheets that don’t depend on location & don’t conflict between each other.
Stylesheets are structured so you can remove or add yours easily. All components are called modules and can be found in the /modules folder. All the groups of components like buttons, text inputs and so on are located in the /library. Such folders structure gives clear separation between groups of objects and modules. Also you can have other different layouts: e.g. homepage, application, admin & re-use the whole /library but with only needed objects.
Please note that all the properties with vendor prefixes are defined as mixins in /framework/mixins.sass. There is also a config of shared variables available to call them inside modules. It is located in /framework/config.sass and has a set of font-sizes, default spaces & colors to use across the project. No need to remember the exact HEX code,so that you can use variables instead.