This is the default pixie configuration for latest version. It can also be accessed on any pixie instance object: pixie.defaultConfig
export const DEFAULT_CONFIG: PixieConfig = {
selector: 'pixie-editor',
textureSize: 4096,
activeLanguage: 'en',
ui: {
visible: true,
mode: EditorMode.INLINE,
forceOverlayModeOnMobile: true,
activeTheme: EditorTheme.LIGHT,
themes: DEFAULT_THEMES,
allowEditorClose: true,
menubar: {
items: [
{
type: 'undoWidget',
align: 'left',
},
{
type: 'zoomWidget',
align: 'center',
desktopOnly: true,
},
{
type: 'button',
icon: HistoryIcon,
align: 'right',
desktopOnly: true,
action: editor => {
editor.togglePanel('history');
},
},
{
type: 'button',
icon: FileDownloadIcon,
label: message('Done'),
align: 'right',
action: editor => {
if (editor.state.config.ui?.showExportPanel) {
editor.state.togglePanel('export', true);
} else {
editor.tools.export.save('image');
}
},
},
],
},
nav: {
position: NavPosition.BOTTOM,
items: [...DEFAULT_NAV_ITEMS],
},
openImageDialog: {
show: true,
sampleImages: [
{
url: 'images/samples/sample1.jpg',
thumbnail: 'images/samples/sample1_thumbnail.jpg',
},
{
url: 'images/samples/sample2.jpg',
thumbnail: 'images/samples/sample2_thumbnail.jpg',
},
{
url: 'images/samples/sample3.jpg',
thumbnail: 'images/samples/sample3_thumbnail.jpg',
},
],
},
colorPresets: {
items: [
'rgb(0,0,0)',
'rgb(255, 255, 255)',
'rgb(242, 38, 19)',
'rgb(249, 105, 14)',
'rgb(253, 227, 167)',
'rgb(4, 147, 114)',
'rgb(30, 139, 195)',
'rgb(142, 68, 173)',
],
},
},
objectDefaults: {
global: {
...defaultObjectProps,
},
sticker: {
fill: undefined,
},
text: {
textAlign: 'initial',
underline: false,
linethrough: false,
fontStyle: 'normal',
fontFamily: 'Times New Roman',
fontWeight: 'normal',
stroke: undefined,
fontSize: 40,
},
},
tools: {
filter: {
items: [
'grayscale',
'blackWhite',
'sharpen',
'invert',
'vintage',
'polaroid',
'kodachrome',
'technicolor',
'brownie',
'sepia',
'removeColor',
'brightness',
'gamma',
'noise',
'pixelate',
'blur',
'emboss',
'blendColor',
],
},
zoom: {
allowUserZoom: true,
fitImageToScreen: true,
},
crop: {
allowCustomRatio: true,
defaultRatio: '1:1',
presets: [
{ratio: null, name: 'Custom'},
{ratio: '1:1', name: 'Square'},
{ratio: '4:3'},
{ratio: '16:9'},
{ratio: '5:3'},
{ratio: '5:4'},
{ratio: '6:4'},
{ratio: '7:5'},
{ratio: '10:8'},
],
},
text: {
defaultText: 'Double click to edit',
controlsPadding: 6,
items: [
{
family: 'Roboto',
src: 'fonts/open-sans-v27-latin-ext_latin-regular.woff2',
},
{
family: 'Fuzzy Bubbles',
src: 'fonts/fuzzy-bubbles-v3-latin-700.woff2',
descriptors: {weight: '700'},
},
{
family: 'Aleo Bold',
src: 'fonts/aleo-v4-latin-ext_latin-700.woff2',
descriptors: {weight: '700'},
},
{
family: 'Amatic SC',
src: 'fonts/amatic-sc-v16-latin-ext_latin-regular.woff2',
},
{
family: 'Corinthia Bold',
src: 'fonts/corinthia-v7-latin-ext_latin-700.woff2',
},
{
family: 'Bungee Inline',
src: 'fonts/bungee-inline-v6-latin-ext_latin-regular.woff2',
},
{
family: 'Robot Slab Bold',
src: 'fonts/roboto-slab-v16-latin-ext_latin-500.woff2',
},
{
family: 'Carter One',
src: 'fonts/carter-one-v12-latin-regular.woff2',
},
{
family: 'Cody Star',
src: 'fonts/codystar-v10-latin-ext_latin-regular.woff2',
},
{
family: 'Fira Sans',
src: 'fonts/fira-sans-v11-latin-ext_latin_cyrillic-regular.woff2',
},
{
family: 'Krona One',
src: 'fonts/krona-one-v9-latin-ext_latin-regular.woff2',
},
{
family: 'Kumar One Outline',
src: 'fonts/kumar-one-outline-v8-latin-ext_latin-regular.woff2',
},
{
family: 'Lobster Two',
src: 'fonts/lobster-two-v13-latin-regular.woff2',
},
{
family: 'Molle Italic',
src: 'fonts/molle-v11-latin-ext_latin-italic.woff2',
},
{
family: 'Monoton',
src: 'fonts/monoton-v10-latin-regular.woff2',
},
{
family: 'Nixie One',
src: 'fonts/nixie-one-v11-latin-regular.woff2',
},
{
family: 'Permanent Marker',
src: 'fonts/permanent-marker-v10-latin-regular.woff2',
},
{
family: 'Sancreek',
src: 'fonts/sancreek-v13-latin-ext_latin-regular.woff2',
},
{
family: 'Stint Ultra Expanded',
src: 'fonts/stint-ultra-expanded-v10-latin-regular.woff2',
},
{
family: 'VT323',
src: 'fonts/vt323-v12-latin-ext_latin-regular.woff2',
},
{
family: 'Trash Hand',
src: 'fonts/TrashHand.ttf',
},
],
},
draw: {
brushSizes: BrushSizes,
brushTypes: BrushTypes,
},
shapes: {
items: defaultShapes.slice(),
},
stickers: {
items: defaultStickers,
},
import: {
validImgExtensions: ['png', 'jpg', 'jpeg', 'svg', 'gif'],
fitOverlayToScreen: true,
openDroppedImageAsBackground: false,
},
export: {
defaultFormat: 'png',
defaultQuality: 0.8,
defaultName: 'image',
},
frame: {
items: [
{
name: 'basic',
mode: 'basic',
size: {
min: 1,
max: 35,
default: 10,
},
},
{
name: 'pine',
mode: 'stretch',
size: {
min: 1,
max: 35,
default: 15,
},
},
{
name: 'oak',
mode: 'stretch',
size: {
min: 1,
max: 35,
default: 15,
},
},
{
name: 'rainbow',
mode: 'stretch',
size: {
min: 1,
max: 35,
default: 15,
},
},
{
name: 'grunge1',
display_name: 'grunge #1',
mode: 'stretch',
size: {
min: 1,
max: 35,
default: 15,
},
},
{
name: 'grunge2',
display_name: 'grunge #2',
mode: 'stretch',
size: {
min: 1,
max: 35,
default: 20,
},
},
{
name: 'ebony',
mode: 'stretch',
size: {
min: 1,
max: 35,
default: 15,
},
},
{
name: 'art1',
display_name: 'Art #1',
mode: 'repeat',
size: {
min: 10,
max: 70,
default: 55,
},
},
{
name: 'art2',
display_name: 'Art #2',
mode: 'repeat',
size: {
min: 10,
max: 70,
default: 55,
},
},
],
},
},
};