6.0.1 • Published 1 year ago
@figma-export/output-styles-as-css v6.0.1
@figma-export/output-styles-as-css
Styles Outputter for @figma-export that exports styles to CSS.
With this outputter you can export all the styles as variables inside a .css
file.
This is a sample of the output:
$ tree output/
# output/
# └── _variables.css
.figmaexportrc.js
You can easily add this outputter to your .figmaexportrc.js
:
import asCss from '@figma-export/output-styles-as-css'
export default {
commands: [
['styles', {
fileId: 'fzYhvQpqwhZDUImRz431Qo',
outputters: [
asCss({
output: './output'
})
]
}],
]
}
output
is mandatory.
getFilename
and getVariableName
are optional.
import asCss from '@figma-export/output-styles-as-css'
import { kebabCase } from '@figma-export/utils'
...
asCss({
output: './output',
getFilename: () => '_variables',
getVariableName = (style, descriptor) => `${kebabCase(style.name).toLowerCase()}${descriptor != null ? `-${descriptor}` : ''}`,
})
defaults may change, please refer to
./src/index.ts
Install
Using npm:
npm install --save-dev @figma-export/output-styles-as-css
or using yarn:
yarn add @figma-export/output-styles-as-css --dev
6.0.1
1 year ago
6.0.0
1 year ago
6.0.0-beta.0
1 year ago
5.0.1
1 year ago
5.0.0
1 year ago
4.8.0
1 year ago
4.8.0-alpha.4
1 year ago
4.8.0-alpha.1
1 year ago
4.8.0-alpha.2
1 year ago
4.8.0-alpha.3
1 year ago
4.8.0-alpha.0
1 year ago
4.7.0
2 years ago
4.7.0-alpha.0
2 years ago
4.6.0
2 years ago
4.5.0
3 years ago
4.4.0
3 years ago
4.0.1
3 years ago
4.0.0
3 years ago
4.2.0
3 years ago
4.0.0-alpha.1
4 years ago
4.0.0-alpha.0
4 years ago
3.5.0
4 years ago
3.4.0
4 years ago
3.3.1
4 years ago
3.3.0
4 years ago
3.2.0
5 years ago
3.1.0
5 years ago
3.0.0
5 years ago
3.0.0-alpha.5
5 years ago