Skip to content

EyeRoe/cross-stitcher

 
 

Repository files navigation

Cross-Stitcher

About:

This is a pattern making website intended for cross-stitch

Description:

Default view of the website

The palette has 450 available colors that mimic the actual colors of DMC thread. The DMC thread number and color name are visible when a color is selected.

Website with one of the color palettes open

Patterns can be saved to your desktop and then later re-uploaded to edit or view.

The available grid is 50x50 which is equivilant to 5" of 16-count Aida fabric. To create a pattern larger than 5", split your projects into the traditional quadrants.

Directions:

Example pattern of pikachu

  • You can begin drawing right away with the defualt color of black.

  • Click and drag on the grid to fill squares with color.

  • To select a new color, click on a color category to browse shades.

  • The active color will show in the pop-up box.

  • To completely erase your project and start over, click the "Erase Design" button.

  • To save a project, click the "Save Design" button, this will save a file to your desktop titled "cross-stich.csv" [if you want to save multiple projects, please manually re-name them]

  • To upload a previous project, click the "Choose File" button.

Technologies Used:

  • React

  • React-Color

  • React-CSV

  • JSX

To-Do:

  • Modify design on Choose File button

  • Edit text when individual color is hoverd on to list DMC instead of Hex Code

  • Fill function

  • Working print function, including colors used

  • Save pattern as image

  • Secondary palette showing used colors

  • Gallery to display saved projects

About

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published

Languages

  • JavaScript 91.0%
  • HTML 5.1%
  • CSS 3.9%