Filepicker + Aviary Better together

We're thrilled to announce that Aviary and will be working together to make it even easier for mobile and web developers to integrate both the advanced content management features of the and the amazing photo editing features of Aviary.

Here's how to get started:


Sample Code

<!--Import the Aviary and Filepicker file picker scripts-->
<script src=''></script>
<script src='//'></script>
<!--Your application-->
<script type='text/javascript'>
    //Setup the Filepicker - to get an apikey, go to

    //Setup Aviary
    var featherEditor = new Aviary.Feather({
        //Get an api key for Aviary at
        apiKey: 'AVIARY_API_KEY',
        apiVersion: 2,
        onSave: function(imageID, newURL) {
            //Export the photo to the cloud using the Filepicker!
            filepicker.export(newURL, {extension:'.png'});
        appendTo: 'web_demo_pane'

    //Giving a placeholder image while Aviary loads
    var preview = document.getElementById('web_demo_preview');

    //When the user clicks the button, import a file using the Filepicker
    var editPane = document.getElementById('start_web_demo');
    editPane.onclick = function(){
        filepicker.pick({mimetype: 'image/*'}, function(InkBlob) {
            //Showing the preview
            preview.src = InkBlob.url;

            //Launching the Aviary Editor
                image: preview,
                url: InkBlob.url

iOS & Android

Both and Aviary have excellent iOS and Android libraries, so you can enable similar functionality in your mobile apps.

Documentation for the | Documentation for Aviary
Documentation for the | Documentation for Aviary

Contact We want to hear from you

Subscribe to our mailing list