Grid

gistfile1.txt

<div className="grid grid-cols-4">
        <h1 className="text-4xl font-extrabold xs:col-span-2 xs:grid xs:gap-4 xs:grid-cols-2 md:col-span-2 md:text-5xl md:grid-cols-3 lg:text-6xl">
        <span className="md:col-span-2">habilidades.</span>
      </h1>
      {skills.map((skill) => (
        <Card
          key={skill.id}
          className={`p-4 bg-transparent`}
        >
          <CardHeader>{skill.icon}</CardHeader>
            <CardContent className="text-center text-white-default">
              <CardTitle>{skill.name}</CardTitle>
            </CardContent>
          </Card>
        ))}
      </div>