Advertisement
HTML/CSS

Introducing Gumby: An Alternative CSS Framework

by

Let me introduce you to Gumby; a flexible CSS framework, currently at version 2.5. Gumby is packed with useful features, which we'll examine throughout the course of a few screencast tutorials. We'll begin by exploring its straightforward CSS variant, the UI kit, the grid, a host of other tricks, then in later videos we'll take a look at Gumby's Sass version.


TL;DR

The original recording of this screencast is around an hour long; more time than a lot of people will be prepared to spend on being introduced to a framework! Here's a quick start guide:

You can also subscribe to Webdesigntuts+ screencasts via YouTube

Introducing Gumby 2.5

Here's the in-depth version of the video. Grab a coffee and get comfy..

Alternatively, Download the video, or subscribe to Webdesigntuts+ screencasts via YouTube

Useful Resources

Related Posts
  • Web Design
    CMS
    Understanding Tumblr Variable TransformationsTumblr 26 retina
    In this video we're going to introduce a concept called Variable Transformation. This is something which Tumblr offers, allowing us to alter the data returned from any given variable. We'll be using Tumblr's {CustomCSS} variable to demonstrate how it works.Read More…
  • Web Design
    CMS
    Completing the Tumblr Post Type CSSTumblr 16 retina
    In this episode we'll complete the CSS for our Tumblr Post Types. We'll also be talking a little about escaped entities within CSS, such as arrows and bullets. Grab a brew, it's a long one.Read More…
  • Web Design
    CMS
    Continuing With Our Tumblr Theme's CSSTumblr 15 retina
    In this part of our Tumblr theming series, we're going to continue with our theme's CSS. We'll be working directly on the live site, as a number of elements won't show up otherwise. Let's dig in!Read More…
  • Web Design
    Applications and Tools
    Building a Complete Website With the Gumby FrameworkGumby site build retina
    In this, our final video tutorial on Gumby, we're going to put all we've learned into practice. We're going to build a complete website using Gumby's semantic grid, parallax effects, toggles and switches, covering workflow best practices as we go. There's plenty to cover, so let's get started!Read More…
  • Web Design
    Applications and Tools
    Setting Up Gumby With the Claymate Command Line ToolGumby claymate retina
    In this tutorial I'm going to explain how you can use Gumby's Claymate. Claymate is a command line interface tool, which helps simplify a number of tasks relating to installing and maintaining your Gumby projects.Read More…
  • Web Design
    CMS
    The Code Behind a Tumblr ThemeTumblr 2 retina
    In this screencast we'll take a first look at the structure of a Tumblr theme and the Tumblr customize area.Read More…