Ecosyste.ms: Awesome

An open API service indexing awesome lists of open source software.

https://github.com/L2jLiga/xd2svg

Utility for converting Adobe eXperience Design files into SVG
https://github.com/L2jLiga/xd2svg

adobe adobe-xd nodejs svg typescript vector-graphics xd xd-files

Last synced: 11 days ago
JSON representation

Utility for converting Adobe eXperience Design files into SVG

Lists

README

        

# xd2svg
[![npm version](https://badge.fury.io/js/xd2svg.svg?colorB=brightgreen)](https://www.npmjs.com/package/xd2svg)
[![npm](https://img.shields.io/npm/dm/xd2svg.svg?colorB=brightgreen)](https://www.npmjs.com/package/xd2svg)
[![node](https://img.shields.io/node/v/xd2svg.svg?colorB=brightgreen)](https://www.npmjs.com/package/xd2svg)
[![Dependency Status](https://img.shields.io/david/L2jLiga/xd2svg.svg)](https://david-dm.org/L2jLiga/xd2svg)
[![License: MIT](https://img.shields.io/badge/License-MIT-brightgreen.svg)](https://opensource.org/licenses/MIT)
[![Build Status](https://travis-ci.org/L2jLiga/xd2svg.svg?branch=master)](https://travis-ci.org/L2jLiga/xd2svg)
[![codecov](https://codecov.io/gh/L2jLiga/xd2svg/branch/master/graph/badge.svg)](https://codecov.io/gh/L2jLiga/xd2svg)

Utility for converting Adobe eXperience Design files into SVG.

## Table of Contents

* [xd2svg](#xd2svg)
* [Table of Contents](#table-of-contents)
* [Getting started](#getting-started)
* [Prerequisites](#prerequisites)
* [Installation](#installation)
* [Using](#using)
* [Contributing](#contributing)
* [Versioning](#versioning)
* [Changelog](#changelog)
* [Authors](#authors)
* [License](#license)
* [Defenition list](#defenition-list)
* [Structure of XD files](#structure-of-xd-files)

## Getting started

### Prerequisites
1. Node.js 8.6.0 or higher
1. Package manager: npm, yarn or what you prefer

### Installation
Two ways to install utility:
1. via npm

```
npm install xd2svg -g
```

1. via yarn

```
yarn global add xd2svg
```

### Using
You can use utility from CLI

```
xd2svg InputFile.xd [options]

options:
-o, --output - specify output path (default FileName directory or FileName.svg)
-s, --single - specify does output should be single file with all artboards or directory with separated each other (default: false)
-p, --pretty-print - specify does output should be pretty printed (default: false)
```

Or [import package into your project](example)

## Contributing
Please read [CONTRIBUTING.md](.github/CONTRIBUTING.md) for details on our code of conduct, and the process for submitting pull requests to us.

*TL;DR*

- Don't duplicate issues
- PR's are welcome!

## Versioning
We use [SemVer](https://semver.org/spec/v2.0.0.html) for versioning.
For the versions available, see the [releases](https://github.com/L2jLiga/xd2svg/releases) and [tags](https://github.com/L2jLiga/xd2svg/tags) on this repository.

## Changelog
The format is based on [Keep a Changelog](https://keepachangelog.com/en/1.0.0/).
For the versions changelog, see the [CHANGELOG.md](CHANGELOG.md)

## Known issues
Blur filters work incorrectly for some cases

## Authors
* **Andrey Chalkin** - *Initial work* - [L2jLiga](https://github.com/L2jLiga)

* **Yang Sibai** - *Testing* - [yangsibai](https://github.com/yangsibai)

See also the list of [contributors](https://github.com/L2jLiga/xd2svg/contributors) who participated in this project.

## License
This project is licensed under the MIT License - see the [LICENSE](LICENSE) file for details

## Defenition list
* **What is Adobe XD?**

It's software from Adobe Creative Cloud which used by designers for creating prototypes.

* **Can I know more about Adobe XD?**

Yes, you can know more on [official website](https://www.adobe.com/ru/products/xd.html).

* **What is present \*.xd files?**

It's simple archives with meta-data and JSON.

## Structure of XD files
Zip data (MIME type "application/vnd.adobe.sparkler.project+dcxucf")

- [__DIR__] artwork
- [__DIR__] artboard-{uuid}
- [__DIR__] graphics
- [__JSON__] graphicsContent.ags
- [__DIR__] pasteboard
- [__DIR__] graphics
- [__JSON__] graphicsContent.ags
- [__DIR__] interactions
- [__JSON__] interactions.json
- [__DIR__] META-INF
- [__XML__] metadata.xml
- [__DIR__] resources
- [__DIR__] graphics
- [__JSON__] graphicsContent.ags
- [__JSON__] manifest
- [__TEXT__] mimetype
- [__IMAGE__] preview.png
- [__IMAGE__] thumbnail.png