Green dirt

Just random pattern

rect(
  0, 0, w, h, 
  ()=> color(
    rand(0x44),
    rand(0x55), 
    rand(0x22)
  ) 
);

Dirt with grass

px.frameRate = 24;
const grassLayer = px.createLayer(1);

const grasses = [];
for(let i = 0; i < w*h/32; i++){  
  let grass = new Point(
    i * 13 %w, 
    i *666* (sin(i)+13) %h
  );
  grass.direction = -PI/2+rand(360)/360/4;
  grass.length = 6+rand(10);
  grass.color = 0x061300 + color(rand(0x44),rand(0x66),rand(0x22));
  grasses.push(grass);
}

const updateGrass = (wind = 0)=>{
  grassLayer.clear();  
  grasses.forEach((grass, n)=>
    grassLayer.line(grass, grass.addClone(
      new Point(grass.length, 0)
        .rotate(grass.direction+wind*(sin(n*18)+1)/2)
    ), grass.color)
  )    
};

updateGrass()

update = (dt, t)=>{
  updateGrass((sin(t)**2+1)/3);
}

Pixel Art

Hey, that dirt and grass are not pixelart, they are just random noise and sticks drawn point by point. So, let's recreate it in the right way.

Four colored dirt

const dirtColors = [0x2b0507, 0x1a2706, 0x3d140f, 0x141313]
rect(0, 0, w, h, _=> rand(dirtColors));

Two colored grass

px.frameRate = 24;
const grassColors = [0x0a3715, 0x28421b],
      grassLayer = px.createLayer(1);

var grasses = [];
for(let i = 0; i < w*h/32; i++){  
  let grass = new Point(
    i * 13 %w, 
    i *666* (sin(i)+13) %h
  );
  grass.direction = rand(6)-1;
  grass.length = 8+rand(6);
  grass.color = rand(grassColors);
  grasses.push(grass);
}
// zIndex sorting
grasses.sort((a,b)=>(a.y-b.y));

const updateGrass = (wind = 0)=>{
  grassLayer.clear();
  const point = new Point(), point2 = new Point(); 
  grasses.forEach((grass, n)=>{
    point.borrow(grass);
    let angle = -PI/2;
    for(let l = 0, _l = grass.length; l < _l; l++){
      grassLayer.Point(point, grass.color);
      grassLayer.point(point.x+1, point.y, 0x1b1c06);
      
      point.add(cos(angle), sin(angle));
      angle += (grass.direction+wind*sin(n))/40;
    }
  })    
};

updateGrass()

update = (dt, t)=>{
  updateGrass((sin(t)**2+1));
}