1. Color organization of SVG element
When registering SVG elements on MiriCanvas, you need to adjust the color setting to allow users to
customize the color. This operation is reffered to as "color organization".
1) Please consolidate similar color series in SVG elements into a single color as much as possible.
2) Shaded areas should be treated as black (#000000), and areas with brightness should be
treated as white (#FFFFFF). The intensity can be adjusted using Opacity.
2. Color Lock in SVG elements
When creating SVG elements, you need to carefully work with the planned color lock settings!
1) In SVG elements, you can set up the color lock in the "Pending" > "Color Lock Setting"
to allow changing only the necessary colors.
2) Set it up to prioritize color changes for larger areas.
- Please try to limit the number of colors to fewer than 5 whenever possible.
- Make sure to lock the shades of black and white that are used for contrast.
3. Color-related considerations
1) SVG elements depicting people (or human characters) should be created with the ability to change
skin color.
2) Elements with excessive paths, complex shapes, or heavy usage of gradatation effect may cause file
size issues. Please register these types of elements as PNG elements.
QnA
1) Why do we process shade with black (or white)?
If the shade is not processed as black when changing the main color of SVG elements, users might
inadvertently change the shades as well. To prevent this inconvenience, changing the shade to black or
white is required.
ex) If the shading is set to black (or white), changing only the primary color doesn't result in an awkward
appearance.
2) There were too many colors used, making it difficult to organize colors.
For SVG elements with an excessive number of colors, please try to organize them in a way that doesn't
appear awkward. Afterward, lock all areas except the ones suitable for color changes by users, such as
clothing, hair, or skin tone.
1. Organize similar-toned colors together to avoid awkwardness.
2. After organizing the colors, add shades to differentiate overlapping areas and define boundaries.
This way, when changing the main color, the shades will also change accordingly.
3. Enable color changes for larger areas or colors that may be frequently changed by users.
(Try to limit the number of colors that can be changed to fewer than 5 whenever possible.)