Create data URI image from Terminal command

image64.sh

#!/bin/sh
# Examples:
# ./image64.sh myImage.png 
#   outputs: data:image/png;base64,xxxxx
# ./image64.sh myImage.png -img
#   outputs: <img src="data:image/png;base64,xxxxx">

filename=$(basename $1)
xtype=${filename##*.}
append=""
if [ $xtype == gif ]; then
	append="data:image/gif;base64,";
elif [ $xtype == jpeg ] || [ $xtype == jpg ]; then
	append="data:image/jpeg;base64,";
elif [ $xtype == png ]; then
	append="data:image/png;base64,";
elif [ $xtype == svg ]; then
	append="data:image/svg+xml;base64,";
elif [ $xtype == ico ]; then
	append="data:image/vnd.microsoft.icon;base64,";
fi

#Mathias Bynens - http://superuser.com/questions/120796/os-x-base64-encode-via-command-line
data=$(openssl base64 < $1 | tr -d '\n')

if [ "$#" -eq 2 ] && [ $2 == -img ]; then
	data=\<img\ src\=\"$append$data\"\>
else
	data=$append$data
fi

echo $data | pbcopy

echo "copied to clipboard"

If you wrap the script in a function like bas64 no need to call the file.sh in your root. I don't think you need the empty append variable. Great little snippet @puppybits

bas64(){
  filename=$(basename $1)
  ext=${filename##*.}
  if [ $ext == gif ]; then
    append="data:image/gif;base64,";
  elif [ $ext == jpeg ] || [ $ext == jpg ]; then
    append="data:image/jpeg;base64,";
  elif [ $ext == png ]; then
    append="data:image/png;base64,";
    echo "this worked $1"
  elif [ $ext == svg ]; then
    append="data:image/svg+xml;base64,";
  elif [ $ext == ico ]; then
    append="data:image/vnd.microsoft.icon;base64,";
  fi

#Mathias Bynens - http://superuser.com/questions/120796/os-x-base64-encode-via-command-line
data=$(openssl base64 < $1 | tr -d '\n')

if [ "$#" -eq 2 ] && [ $2 == -img ]; then
	data=\<img\ src\=\"$append$data\"\>
else
	data=$append$data
fi

echo $data | pbcopy

echo "copied to clipboard"
}

You can also remove the "shell escapes" via the following code

e.g. If the input is Desktop/Screen\ Shot\ 2018-11-10\ at\ 10.53.08\ AM.png

b64img(){
    # Remove escapes from the spaces
    FILE_PATH=$(echo $1 | tr -s " " "\\ ")

    filename=$(basename $FILE_PATH)
    ext=${filename##*.}
    if [ $ext == gif ]; then
        append="data:image/gif;base64,";
    elif [ $ext == jpeg ] || [ $ext == jpg ]; then
        append="data:image/jpeg;base64,";
    elif [ $ext == png ]; then
        append="data:image/png;base64,";
        echo "this worked {$FILE_PATH}"
    elif [ $ext == svg ]; then
        append="data:image/svg+xml;base64,";
    elif [ $ext == ico ]; then
        append="data:image/vnd.microsoft.icon;base64,";
    fi

    #Mathias Bynens - http://superuser.com/questions/120796/os-x-base64-encode-via-command-line
    data=$(openssl base64 < "$FILE_PATH" | tr -d '\n')

    if [ "$#" -eq 2 ] && [ $2 == -img ]; then
	    data=\<img\ src\=\"$append$data\"\>
    else
    	    data=$append$data
    fi
    echo $data | pbcopy
}

@puppybits
@Blumed
@joubin

nice, nice, and nice 👌👌

Worth mentioning, this bash function is setup to accept a second parameter, which adds the relevant string for it to be a valid DOM img src dom attribute.

b64img path_to_image.gif -img