---
layout: home
title: Ratchet
---
< div class = "docs-header" >
< header class = "docs-masthead" >
< div class = "container" >
< div class = "column units-2" >
< a class = "docs-nav icon icon-bars pull-right" href = "/components" data-ignore = "push" > < / a >
< h1 class = "docs-title" > Ratchet< / h1 >
< / div >
< / div >
< / header >
< div class = "docs-header-content" >
< p class = "docs-subtitle" > Build mobile apps with simple HTML‚ CSS‚ and JS components.< / p >
< a data-ignore = "push" href = "http://maker.github.com/ratchet/ratchet.zip" class = "btn btn-primary" onClick = "_gaq.push(['_trackEvent', 'Downloads', 'V2.0']);" > Download Ratchet< / a >
< / div >
< div id = "carbonads-container" > < div class = "carbonad" > < div id = "azcarbon" > < / div > < script type = "text/javascript" > var z = document . createElement ( "script" ) ; z . type = "text/javascript" ; z . async = true ; z . src = "http://engine.carbonads.com/z/58147/azcarbon_2_1_0_HORIZ" ; var s = document . getElementsByTagName ( "script" ) [ 0 ] ; s . parentNode . insertBefore ( z , s ) ; < / script > < / div > < / div >
<!-- Social links -->
< ul class = "social" >
< li >
< iframe src = "http://ghbtns.com/github-btn.html?user=maker&repo=ratchet&type=watch&count=true" allowtransparency = "true" frameborder = "0" scrolling = "0" width = "100px" height = "20px" > < / iframe >
< / li >
< li >
< a data-ignore = "push" href = "https://twitter.com/share" class = "twitter-share-button" data-url = "http://goratchet.com" data-text = "Ratchet – Build mobile apps with simple HTML, CSS, and JS components." data-via = "GoRatchet" > Tweet< / a >
< script > ! function ( d , s , id ) { var js , fjs = d . getElementsByTagName ( s ) [ 0 ] ; if ( ! d . getElementById ( id ) ) { js = d . createElement ( s ) ; js . id = id ; js . src = "//platform.twitter.com/widgets.js" ; fjs . parentNode . insertBefore ( js , fjs ) ; } } ( document , "script" , "twitter-wjs" ) ; < / script >
< / li >
< li > < a data-ignore = "push" href = "https://twitter.com/GoRatchet" class = "twitter-follow-button" data-show-count = "true" >
Follow @GoRatchet< / a >
< script > ! function ( d , s , id ) { var js , fjs = d . getElementsByTagName ( s ) [ 0 ] ; if ( ! d . getElementById ( id ) ) { js = d . createElement ( s ) ; js . id = id ; js . src = "//platform.twitter.com/widgets.js" ; fjs . parentNode . insertBefore ( js , fjs ) ; } } ( document , "script" , "twitter-wjs" ) ; < / script >
< / li >
< / ul >
< / div >