Services 01

File: src/blocks/services/Services01.astro

Service / capability grid with optional Lucide icons per item.

Config (blocks.ts → services)

services: {
    width: "standard",
    heading: "What I do",
    subheading:
      "End-to-end web development — from first wireframe to production deploy. I partner with designers, agencies, and founders who value quality over shortcuts.",
    items: [
      {
        icon: "code",
        title: "Frontend Development",
        description:
          "Pixel-perfect implementations with Astro, React, and Tailwind. Performance budgets, accessibility, and responsive design baked in.",
      },
      {
        icon: "layout-template",
        title: "Marketing Sites",
        description:
          "High-converting landing pages and multi-page marketing sites. SEO-ready, CMS-connected, and easy for your team to update.",
      },
      {
        icon: "layers",
        title: "Headless CMS",
        description:
          "Sanity, Contentful, or Markdown — structured content models, preview workflows, and editor-friendly Studio setups.",
      },
      {
        icon: "zap",
        title: "Performance & SEO",
        description:
          "Core Web Vitals optimization, semantic markup, structured data, and sitemaps. Sites that rank and load fast.",
      },
    ],
  },

Add to a page

---
import Services01 from "@/blocks/services/Services01.astro";
---

<Services01 />

Props override matching keys from config:

<Services01
  heading="Custom headline"
/>

Props

← Services versions · Blocks overview