webkit_sprite

#!/bin/bash
#
# Usage:
#     PADDING=10 HTML_NORMAL=normal.html HTML_HOVER=hover.html ./webkit_sprite
#
if [ -z "$PADDING" ]
then
        echo "You need to specify PADDING"
        exit -1
fi
if [ -z "$HTML_NORMAL" ]
then
        echo "You need to specify HTML_NORMAL"
        exit -1
fi
if [ -z "HTML_HOVER" ]
then
        echo "You need to specify HTML_HOVER"
        exit -1
fi
if [ -z "$OUTFILE" ]
then
    OUTFILE=sprite.png
fi

webkit2png --transparent --wait 1 --output=/tmp/css_normal.png file://$(realpath ${HTML_NORMAL})
webkit2png --transparent --wait 1 --output=/tmp/css_hover.png file://$(realpath ${HTML_HOVER})
convert -trim +repage /tmp/css_normal.png /tmp/css_normal.png
convert -trim +repage /tmp/css_hover.png /tmp/css_hover.png
montage /tmp/css_normal.png /tmp/css_hover.png -background transparent -tile 1x2 -geometry +0+0 /tmp/css_combined.png

IMAGE_WIDTH=$(identify -format '%w' /tmp/css_combined.png)
IMAGE_HEIGHT=$(identify -format '%h' /tmp/css_combined.png)
CROP_WIDTH=$(expr ${IMAGE_WIDTH} - ${PADDING})
convert /tmp/css_combined.png -gravity west -crop ${CROP_WIDTH}x${IMAGE_HEIGHT}+0+0 +repage /tmp/css_left.png
convert /tmp/css_combined.png -gravity east -crop ${PADDING}x${IMAGE_HEIGHT}+0+0 -background transparent -extent ${CROP_WIDTH}x${IMAGE_HEIGHT} /tmp/css_right.png
montage /tmp/css_left.png /tmp/css_right.png -background transparent -tile 1x2 -geometry +0+0 ${OUTFILE}
echo "File written to ${OUTFILE}"

rm /tmp/css_normal.png
rm /tmp/css_hover.png
rm /tmp/css_combined.png
rm /tmp/css_left.png
rm /tmp/css_right.png

Just for reference http://blogs.sitepoint.com/2010/12/31/use-webkit-and-imagemagick-to-create-cross-browser-buttons/