diff --git a/src/servala/frontend/forms/renderers.py b/src/servala/frontend/forms/renderers.py
index f8cdb5d..90ce926 100644
--- a/src/servala/frontend/forms/renderers.py
+++ b/src/servala/frontend/forms/renderers.py
@@ -16,13 +16,20 @@ class VerticalFormRenderer(TemplatesSetting):
     form_template_name = "frontend/forms/form.html"
     field_template_name = "frontend/forms/vertical_field.html"
 
+    def get_class_names(self, input_type):
+        if input_type == "checkbox":
+            return "form-check-input"
+        return "form-control"
+
     def render(self, template_name, context, request=None):
         if field := context.get("field"):
-            if field.field.widget.input_type == "checkbox":
-                class_name = "form-check-input"
-            else:
-                class_name = "form-control"
             field.build_widget_attrs = inject_class(
-                field.build_widget_attrs, class_name
+                field.build_widget_attrs,
+                self.get_class_names(field.field.widget.input_type),
             )
         return super().render(template_name, context, request)
+
+
+class InlineFormRenderer(VerticalFormRenderer):
+    form_template_name = "frontend/forms/form.html"
+    field_template_name = "frontend/forms/inline_field.html"
diff --git a/src/servala/frontend/templates/frontend/base.html b/src/servala/frontend/templates/frontend/base.html
index 62c6b33..87c8a1c 100644
--- a/src/servala/frontend/templates/frontend/base.html
+++ b/src/servala/frontend/templates/frontend/base.html
@@ -8,6 +8,7 @@
         <link rel="stylesheet"
               href="{% static 'mazer/compiled/css/app-dark.css' %}">
         <link rel="stylesheet" href="{% static 'mazer/compiled/css/iconly.css' %}">
+        <link rel="stylesheet" href="{% static 'css/servala.css' %}">
         <script src="{% static "js/htmx.min.js" %}" defer></script>
     </head>
     <title>
diff --git a/src/servala/frontend/templates/frontend/forms/field.html b/src/servala/frontend/templates/frontend/forms/field.html
new file mode 100644
index 0000000..f4b16d1
--- /dev/null
+++ b/src/servala/frontend/templates/frontend/forms/field.html
@@ -0,0 +1,16 @@
+{% load i18n %}
+<div class="form-group d-inline{% if field.field.required %} mandatory{% endif %}{% if errors %} is-invalid{% endif %}{% if extra_class %} {{ extra_class }}{% endif %}">
+    {% if field.use_fieldset %}
+        <fieldset {% if field.help_text and field.auto_id and "aria-describedby" not in field.field.widget.attrs %} aria-describedby="{{ field.auto_id }}_helptext"{% endif %}>
+        {% endif %}
+        {{ field }}
+        {% if field.field.widget.input_type == "checkbox" and not field.field.widget.allow_multiple_selected %}
+            <label for="{{ field.auto_id }}" class="form-check-label form-label">{{ field.label }}</label>
+        {% endif %}
+        {% if field.use_fieldset %}</fieldset>{% endif %}
+    {% for text in field.errors %}<div class="invalid-feedback">{{ text }}</div>{% endfor %}
+    {% if field.help_text %}
+        <small class="form-text text-muted"
+               {% if field.auto_id %}id="{{ field.auto_id }}_helptext"{% endif %}>{{ field.help_text|safe }}</small>
+    {% endif %}
+</div>
diff --git a/src/servala/frontend/templates/frontend/forms/inline_field.html b/src/servala/frontend/templates/frontend/forms/inline_field.html
new file mode 100644
index 0000000..c229641
--- /dev/null
+++ b/src/servala/frontend/templates/frontend/forms/inline_field.html
@@ -0,0 +1 @@
+{% include "frontend/forms/field.html" with extra_class="d-inline" %}
diff --git a/src/servala/frontend/templates/frontend/forms/vertical_field.html b/src/servala/frontend/templates/frontend/forms/vertical_field.html
index a2457d9..544d07d 100644
--- a/src/servala/frontend/templates/frontend/forms/vertical_field.html
+++ b/src/servala/frontend/templates/frontend/forms/vertical_field.html
@@ -1,21 +1 @@
-{% load i18n %}
-<div class="col-12">
-    <div class="form-group{% if field.field.required %} mandatory{% endif %}{% if errors %} is-invalid{% endif %}">
-        {% if field.field.widget.input_type != "checkbox" or field.field.widget.allow_multiple_selected %}
-            <label for="{{ field.auto_id }}" class="form-label">{{ field.label }}</label>
-        {% endif %}
-        {% if field.use_fieldset %}
-            <fieldset {% if field.help_text and field.auto_id and "aria-describedby" not in field.field.widget.attrs %} aria-describedby="{{ field.auto_id }}_helptext"{% endif %}>
-            {% endif %}
-            {{ field }}
-            {% if field.field.widget.input_type == "checkbox" and not field.field.widget.allow_multiple_selected %}
-                <label for="{{ field.auto_id }}" class="form-check-label form-label">{{ field.label }}</label>
-            {% endif %}
-            {% if field.use_fieldset %}</fieldset>{% endif %}
-        {% for text in field.errors %}<div class="invalid-feedback">{{ text }}</div>{% endfor %}
-        {% if field.help_text %}
-            <small class="form-text text-muted"
-                   {% if field.auto_id %}id="{{ field.auto_id }}_helptext"{% endif %}>{{ field.help_text|safe }}</small>
-        {% endif %}
-    </div>
-</div>
+<div class="col-12">{% include "frontend/forms/field.html" %}</div>
diff --git a/src/servala/static/css/servala.css b/src/servala/static/css/servala.css
new file mode 100644
index 0000000..826a458
--- /dev/null
+++ b/src/servala/static/css/servala.css
@@ -0,0 +1,3 @@
+.form-group.d-inline {
+    margin-bottom: 0;
+}