<!DOCTYPE html>
<html class="en-GB">
<head>
<title>Customisable by design</title>
<meta name="description" content="Not every app needs the same kind of features. Sjabloon gives you the option to add or skip certain features when you start your new app." />
<meta name="csrf-param" content="authenticity_token" />
<meta name="csrf-token" content="PSdaHk3vr65uINsQ+I3s4ZfMhfQcKNbDeqsfY/UlDrb6HfzNOKG1i9Lby1Vma5Bo7yM7UmR+YKKZYeVzG19PFg==" />
<script src="https://js.stripe.com/v3/"></script>
<meta property="og:site_name" content="Sjabloon">
<meta property="og:title" content="Customisable by design" />
<meta property="og:description" content="Not every app needs the same kind of features. Sjabloon gives you the option to add or skip certain features when you start your new app.">
<meta property="og:type" content="website" />
<meta property="og:url" content="https://www.getsjabloon.com/features/customisable" />
<meta property="og:image" content="https://www.getsjabloon.com/packs/media/images/social-483fb4efa20beb2655befb29d65850d1.jpg"></meta>
<meta name="twitter:card" content="summary_large_image">
<meta name="twitter:site" content="@ntscHQ">
<meta name="twitter:domain" value="getsjabloon.com" />
<meta name="twitter:title" value="Customisable by design" />
<meta name="twitter:description" value="Not every app needs the same kind of features. Sjabloon gives you the option to add or skip certain features when you start your new app." />
<meta property="twitter:image" content="https://www.getsjabloon.com/packs/media/images/social-483fb4efa20beb2655befb29d65850d1.jpg"></meta>
<meta name="twitter:url" value="https://www.getsjabloon.com/features/customisable" />
<meta property="og:logo" content="https://www.getsjabloon.com/logo.jpg" />
<script src="/packs/js/application-52108bb48a94ea445faf.js" data-turbolinks-track="reload"></script>
<link rel="stylesheet" media="screen" href="/packs/css/application-49f7a508.css" data-turbolinks-track="reload" />
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta name="google-site-verification" content="6ZvJ4u5D3MhqQhHVjdjAzRUq66Za_Xez7zSLX7tJ-E0" />
</head>
<body class="">
<div class="site-announcement" data-controller="site-announcements" data-target="site-announcements.banner" data-site-announcements-id="37" data-site-announcements-site-name="sjabloon">
<span class="site-announcement__badge site-announcement__badge--#{last_announcement.announcement_type}">
news
</span>
<a class="site-announcement__title" href="https://railsdesigner.com/">Professionally designed UI components to build your next Ruby on Rails app even faster</a>
<a class="site-announcement__action" href="https://railsdesigner.com/">Check it out</a>
<button class="site-announcement__close" data-action="click->site-announcements#dismiss">
<svg viewbox="0 0 20 20" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="site-announcement__close-icon"> <g id="Page-1" stroke="none" stroke-width="1" fill-rule="evenodd"> <g id="icon-shape"> <polygon id="Combined-Shape" points="10 8.58578644 2.92893219 1.51471863 1.51471863 2.92893219 8.58578644 10 1.51471863 17.0710678 2.92893219 18.4852814 10 11.4142136 17.0710678 18.4852814 18.4852814 17.0710678 11.4142136 10 18.4852814 2.92893219 17.0710678 1.51471863 10 8.58578644"></polygon> </g> </g> </svg>
</button>
</div>
<nav class="justify-between text-sm leading-tight nav" data-controller="navigation" data-target="navigation.component" data-action="scroll@window->navigation#onScroll">
<a class="inline-flex" href="/">
<svg width="30" height="30" viewBox="0 0 200 200" xmlns="http://www.w3.org/2000/svg"><title>logo</title><defs><linearGradient x1="50%" y1="100%" x2="50%" y2="0%" id="a"><stop stop-color="#00CAFF" offset="0%"/><stop stop-color="#009AFF" offset="100%"/></linearGradient></defs><g fill="none" fill-rule="evenodd"><circle fill="url(#a)" cx="100" cy="100" r="100"/><path d="M126.412 145.011v16.379H72.565v-16.379H46L83.558 39h35.136l37.356 106.011h-29.638zm-7.464-24.006L102.54 64.847l-16.267 56.158h32.676z" fill="#FFF"/></g></svg>
</a>
<div class="nav__items" data-target="navigation.items">
<a class="nav__item nav__link" href="/login">log in</a>
</div>
<span role="link" class="navigation__item navigation__toggle" data-target="navigation.toggle" data-action="click->navigation#toggle">menu</span>
</nav>
<div class="overflow-hidden hero">
<div class="container hero__content">
<span class="feature-hero__tag">Feature</span>
<h1 class="feature-hero__heading">
Customisable by design
</h1>
<p class="feature-hero__intro">If you have built many web apps, you know that not every app needs the same kind of features. Some might need authentication and payments, others might not. Sjabloon is unique in that it gives you the option to add or skip certain features when you start your next app.</p>
</div>
<div class="bg-no-repeat bg-cover shadow-lg chrome-wrapper" style="background-image: url(https://www.getsjabloon.com/packs/media/images/customisable-5cf876d7f42666f324d7b36ead8da03e.jpg); width: 100%; max-width: 120rem; height: 30rem"></div>
</div>
<div class="max-w-xl mx-auto mt-16">
<h2 class="mt-6 mb-1 text-xl font-bold">Choose which features you need</h2>
<p class="mb-8">
Many SaaS starter kits come with many features added. Great, until you don't need a certain feature. Then you spend more time removing the features after installation. That goes against our driving principle of working on the core of your product from the start.
</p>
<p class="mb-8">Using Sjabloon you can add or skip features like default Rails options (ActionCable, ActiveStorage), but also Sjabloon exclusive features such as: authentication, payments and announcements. So you can hit the ground running with a foundation that fits your next app perfectly.</p>
<h2 class="mt-6 mb-1 text-xl font-bold">Multiple themes ready to go</h2>
<p class="mb-8">Choose from three unique and exclusive homepage designs. Focussed on modern SaaS apps, so you can be sure your next app will be make a great first impression.</p>
<h2 class="mt-6 mb-1 text-xl font-bold">Third-party integrations optional</h2>
<p class="mb-8">With just a few clicks you can have the JS code snippets added for numerous third-party services. From customer support tools like Intercom, analytics with Google Analytics and error monitoring with Bugsnag. No need to go their website, copy their code and paste into your app. It's all done for you.</p>
</div>
<footer class="footer-wrapper">
</footer>
<script async defer data-domain="getsjabloon.com" src="https://plausible.io/js/plausible.js"></script>
</body>
</html>