Feature Grid

Grid of feature entries separated by hairline seams. Good for summarising what makes your product different.

Preview

Why teams pick us.

Fast

Static output. No runtime, no database, no cold starts.

Simple

Write pages as Python functions. No new syntax.

Flexible

Drop in any Python library. Build time is yours.

Code

from nitro_ui import Div, H2, H3, Paragraph, Section


FEATURES = [
    {"title": "Fast", "desc": "Static output. No runtime, no database, no cold starts."},
    {"title": "Simple", "desc": "Write pages as Python functions. No new syntax."},
    {"title": "Flexible", "desc": "Drop in any Python library. Build time is yours."},
]

COLORS = ["blue", "pink", "green"]


def FeatureGrid():
    cards = [
        Div(
            H3(f["title"], cls="feature-card-title"),
            Paragraph(f["desc"], cls="feature-card-desc"),
            cls=f"feature-card feature-card--{COLORS[i % len(COLORS)]}",
        )
        for i, f in enumerate(FEATURES)
    ]
    return Section(
        Div(
            H2("Why teams pick us.", cls="section-title"),
            Div(*cards, cls="feature-grid"),
            cls="container",
        ),
        cls="features-section",
    )