Lyméa is a high-end conceptual landing page for a natural skincare brand.
This project showcases a full-cycle production — from visual identity in Figma to a high-performance frontend implementation deployed on Vercel.
![](data:image/svg+xml,<svg display="block" role="presentation" viewBox="0 0 57 57" xmlns="http://www.w3.org/2000/svg"><g d="M 3.954 50.046 C 0 46.092 0 39.729 0 27.001 C 0 14.272 0 7.909 3.954 3.955 C 7.908 0 14.272 0 26.999 0 C 39.728 0 46.092 0 50.046 3.954 C 54 7.908 54 14.272 54 26.999 C 54 39.728 54 46.092 50.046 50.046 C 46.092 54 39.729 54 27.001 54 C 14.272 54 7.908 54 3.955 50.046 Z M 0 18.271 L 54 18.271 M 15.63 53.797 L 15.63 18.271" fill="transparent" height="54px" id="r5UbRMDWN" transform="translate(1 2)" width="54px"><path d="M 3.954 50.046 C 0 46.092 0 39.729 0 27.001 C 0 14.272 0 7.909 3.954 3.955 C 7.908 0 14.272 0 26.999 0 C 39.728 0 46.092 0 50.046 3.954 C 54 7.908 54 14.272 54 26.999 C 54 39.728 54 46.092 50.046 50.046 C 46.092 54 39.729 54 27.001 54 C 14.272 54 7.908 54 3.955 50.046 Z" fill="transparent" height="54px" id="JAse0VyFM" stroke-dasharray="" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.5" stroke="rgb(133, 40, 47)" width="54px"/><path d="M 0 0 L 54 0 M 15.63 35.526 L 15.63 0" fill="transparent" height="35.52577084830818px" id="UUK1OEPXA" stroke-dasharray="" stroke-linecap="butt" stroke-linejoin="miter" stroke-miterlimit="10" stroke-width="1.5" stroke="rgb(133, 40, 47)" transform="translate(0 18.271)" width="54px"/></g></svg>)
![](data:image/svg+xml,<svg display="block" role="presentation" viewBox="0 0 57 57" xmlns="http://www.w3.org/2000/svg"><g d="M 34.886 0 C 35.216 -0.001 35.502 0.228 35.575 0.549 L 36.991 6.838 C 38.132 11.908 42.091 15.867 47.16 17.009 L 53.449 18.425 C 53.771 18.497 54 18.782 54 19.112 C 54 19.442 53.771 19.728 53.449 19.8 L 47.16 21.216 C 42.091 22.358 38.132 26.316 36.99 31.385 L 35.574 37.675 C 35.5 37.995 35.215 38.223 34.886 38.223 C 34.557 38.223 34.272 37.995 34.199 37.675 L 32.783 31.385 C 31.64 26.317 27.682 22.358 22.614 21.216 L 16.325 19.8 C 16.003 19.728 15.774 19.442 15.774 19.112 C 15.774 18.782 16.003 18.497 16.325 18.425 L 22.614 17.008 C 27.683 15.867 31.642 11.908 32.784 6.838 L 34.199 0.549 L 34.235 0.434 C 34.345 0.171 34.601 0 34.886 0 Z M 34.157 7.148 C 32.896 12.748 28.523 17.121 22.924 18.382 L 19.685 19.112 L 22.924 19.842 C 28.523 21.103 32.896 25.476 34.157 31.076 L 34.886 34.314 L 35.617 31.076 C 36.878 25.476 41.251 21.103 46.851 19.842 L 50.088 19.112 L 46.851 18.382 C 41.251 17.121 36.878 12.748 35.617 7.148 L 34.886 3.91 Z M 13.85 26.297 C 14.179 26.297 14.464 26.525 14.536 26.846 L 15.549 31.338 C 16.348 34.883 19.116 37.651 22.661 38.45 L 27.152 39.463 C 27.472 39.537 27.699 39.821 27.699 40.15 C 27.699 40.478 27.472 40.763 27.152 40.836 L 22.661 41.85 C 19.116 42.648 16.348 45.416 15.549 48.961 L 14.536 53.453 C 14.463 53.773 14.178 54 13.85 54 C 13.521 54 13.237 53.773 13.163 53.453 L 12.15 48.961 C 11.351 45.416 8.583 42.648 5.039 41.85 L 0.547 40.835 C 0.227 40.762 0 40.477 0 40.149 C 0 39.82 0.227 39.536 0.547 39.462 L 5.039 38.449 C 8.583 37.651 11.351 34.882 12.15 31.337 L 13.163 26.845 L 13.2 26.73 C 13.309 26.468 13.565 26.297 13.85 26.297 Z M 13.525 31.648 C 12.606 35.724 9.424 38.906 5.349 39.825 L 3.907 40.15 L 5.349 40.475 C 9.424 41.393 12.606 44.576 13.525 48.651 L 13.85 50.092 L 14.175 48.651 C 15.093 44.576 18.275 41.393 22.351 40.475 L 23.791 40.15 L 22.351 39.825 C 18.275 38.906 15.093 35.724 14.175 31.648 L 13.85 30.207 Z" fill="transparent" height="54px" id="CvN_nL1Y4" transform="translate(2 1)" width="54.00000028208798px"><path d="M 34.886 0 C 35.216 -0.001 35.502 0.228 35.575 0.549 L 36.991 6.838 C 38.132 11.908 42.091 15.867 47.16 17.009 L 53.449 18.425 C 53.771 18.497 54 18.782 54 19.112 C 54 19.442 53.771 19.728 53.449 19.8 L 47.16 21.216 C 42.091 22.358 38.132 26.316 36.99 31.385 L 35.574 37.675 C 35.5 37.995 35.215 38.223 34.886 38.223 C 34.557 38.223 34.272 37.995 34.199 37.675 L 32.783 31.385 C 31.64 26.317 27.682 22.358 22.614 21.216 L 16.325 19.8 C 16.003 19.728 15.774 19.442 15.774 19.112 C 15.774 18.782 16.003 18.497 16.325 18.425 L 22.614 17.008 C 27.683 15.867 31.642 11.908 32.784 6.838 L 34.199 0.549 L 34.235 0.434 C 34.345 0.171 34.601 0 34.886 0 Z M 34.157 7.148 C 32.896 12.748 28.523 17.121 22.924 18.382 L 19.685 19.112 L 22.924 19.842 C 28.523 21.103 32.896 25.476 34.157 31.076 L 34.886 34.314 L 35.617 31.076 C 36.878 25.476 41.251 21.103 46.851 19.842 L 50.088 19.112 L 46.851 18.382 C 41.251 17.121 36.878 12.748 35.617 7.148 L 34.886 3.91 Z M 13.85 26.297 C 14.179 26.297 14.464 26.525 14.536 26.846 L 15.549 31.338 C 16.348 34.883 19.116 37.651 22.661 38.45 L 27.152 39.463 C 27.472 39.537 27.699 39.821 27.699 40.15 C 27.699 40.478 27.472 40.763 27.152 40.836 L 22.661 41.85 C 19.116 42.648 16.348 45.416 15.549 48.961 L 14.536 53.453 C 14.463 53.773 14.178 54 13.85 54 C 13.521 54 13.237 53.773 13.163 53.453 L 12.15 48.961 C 11.351 45.416 8.583 42.648 5.039 41.85 L 0.547 40.835 C 0.227 40.762 0 40.477 0 40.149 C 0 39.82 0.227 39.536 0.547 39.462 L 5.039 38.449 C 8.583 37.651 11.351 34.882 12.15 31.337 L 13.163 26.845 L 13.2 26.73 C 13.309 26.468 13.565 26.297 13.85 26.297 Z M 13.525 31.648 C 12.606 35.724 9.424 38.906 5.349 39.825 L 3.907 40.15 L 5.349 40.475 C 9.424 41.393 12.606 44.576 13.525 48.651 L 13.85 50.092 L 14.175 48.651 C 15.093 44.576 18.275 41.393 22.351 40.475 L 23.791 40.15 L 22.351 39.825 C 18.275 38.906 15.093 35.724 14.175 31.648 L 13.85 30.207 Z" fill="rgb(133, 40, 47)" height="54px" id="oCPdCqvxq" width="54.00000028208798px"/></g></svg>)
![](data:image/svg+xml,<svg display="block" role="presentation" viewBox="0 0 57 57" xmlns="http://www.w3.org/2000/svg"><g d="M 38.167 21.113 L 41.651 24.117 C 43.117 25.381 43.85 26.012 43.85 26.797 C 43.85 27.582 43.117 28.213 41.651 29.477 L 38.165 32.481 M 15.429 21.113 L 11.943 24.117 C 10.478 25.381 9.744 26.012 9.744 26.797 C 9.744 27.582 10.478 28.213 11.943 29.477 L 15.429 32.481 M 29.639 18.271 L 23.954 35.324 M 0 27.001 C 0 14.272 0 7.908 3.954 3.955 C 7.908 0 14.272 0 26.999 0 C 39.728 0 46.092 0 50.046 3.954 C 54 7.908 54 14.272 54 26.999 C 54 39.728 54 46.092 50.046 50.046 C 46.092 54 39.729 54 27.001 54 C 14.272 54 7.908 54 3.955 50.046 C 0 46.092 0 39.729 0 27.001 Z" fill="transparent" height="54px" id="juI3QKrGN" transform="translate(2 2)" width="54px"><path d="M 28.422 2.842 L 31.907 5.847 C 33.372 7.11 34.106 7.741 34.106 8.526 C 34.106 9.311 33.372 9.942 31.907 11.206 L 28.421 14.21 M 5.685 2.842 L 2.199 5.847 C 0.733 7.11 0 7.741 0 8.526 C 0 9.311 0.733 9.942 2.199 11.206 L 5.685 14.21 M 19.894 0 L 14.21 17.053" fill="transparent" height="17.052759773036943px" id="Pneq6j2tb" stroke-dasharray="" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.5" stroke="rgb(133, 40, 47)" transform="translate(9.744 18.271)" width="34.10552148102852px"/><path d="M 0 27.001 C 0 14.272 0 7.908 3.954 3.955 C 7.908 0 14.272 0 26.999 0 C 39.728 0 46.092 0 50.046 3.954 C 54 7.908 54 14.272 54 26.999 C 54 39.728 54 46.092 50.046 50.046 C 46.092 54 39.729 54 27.001 54 C 14.272 54 7.908 54 3.955 50.046 C 0 46.092 0 39.729 0 27.001 Z" fill="transparent" height="54px" id="E8erjfTMo" stroke-dasharray="" stroke-linecap="butt" stroke-linejoin="miter" stroke-miterlimit="10" stroke-width="1.5" stroke="rgb(133, 40, 47)" width="54px"/></g></svg>)
![](data:image/svg+xml,<svg display="block" role="presentation" viewBox="0 0 57 57" xmlns="http://www.w3.org/2000/svg"><g d="M 1.846 52.247 C 3.024 53.369 4.624 54 6.293 54 C 7.961 54 9.561 53.369 10.74 52.247 L 49.282 15.634 C 50.463 14.515 51.127 12.995 51.127 11.409 C 51.127 9.824 50.463 8.304 49.282 7.185 C 48.103 6.062 46.503 5.432 44.835 5.432 C 43.166 5.432 41.566 6.062 40.388 7.185 L 1.846 43.798 C 0.664 44.917 0 46.437 0 48.022 C 0 49.607 0.664 51.127 1.846 52.247 Z M 44.863 19.831 L 35.969 11.382 M 16.942 1.238 L 21.389 0 L 20.084 4.225 L 21.389 8.449 L 16.942 7.21 L 12.495 8.449 L 13.8 4.225 L 12.495 0 Z M 5.082 18.137 L 9.529 16.898 L 8.225 21.123 L 9.529 25.348 L 5.082 24.108 L 0.635 25.348 L 1.94 21.123 L 0.635 16.898 Z M 49.553 32.219 L 54 30.98 L 52.695 35.204 L 54 39.429 L 49.553 38.19 L 45.106 39.429 L 46.411 35.204 L 45.106 30.98 Z" fill="transparent" height="53.99999795729506px" id="Xf19U14Qv" transform="translate(1.5 1.5)" width="54.00000017364977px"><path d="M 1.846 46.815 C 3.024 47.938 4.624 48.568 6.293 48.568 C 7.961 48.568 9.561 47.938 10.74 46.815 L 49.282 10.202 C 50.463 9.083 51.127 7.563 51.127 5.978 C 51.127 4.393 50.463 2.873 49.282 1.753 C 48.103 0.631 46.503 0 44.835 0 C 43.166 0 41.566 0.631 40.388 1.753 L 1.846 38.366 C 0.664 39.485 0 41.005 0 42.591 C 0 44.176 0.664 45.696 1.846 46.815 Z M 44.863 14.399 L 35.969 5.95" fill="transparent" height="48.56838594252455px" id="dP0uCaENx" stroke-dasharray="" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.5" stroke="rgb(133, 40, 47)" transform="translate(0 5.432)" width="51.12732251381357px"/><path d="M 16.307 1.238 L 20.754 0 L 19.449 4.225 L 20.754 8.449 L 16.307 7.21 L 11.86 8.449 L 13.165 4.225 L 11.86 0 Z M 4.447 18.137 L 8.894 16.898 L 7.589 21.123 L 8.894 25.348 L 4.447 24.108 L 0 25.348 L 1.305 21.123 L 0 16.898 Z M 48.918 32.219 L 53.365 30.98 L 52.06 35.204 L 53.365 39.429 L 48.918 38.19 L 44.471 39.429 L 45.775 35.204 L 44.471 30.98 Z" fill="transparent" height="39.42867984179879px" id="YMcQ9EWiF" stroke-dasharray="" stroke-linecap="round" stroke-linejoin="round" stroke-width="1" stroke="rgb(133, 40, 47)" transform="translate(0.635 0)" width="53.36470603426454px"/></g></svg>)
![](data:image/svg+xml,<svg display="block" role="presentation" viewBox="0 0 57 57" xmlns="http://www.w3.org/2000/svg"><g d="M 35.732 21.047 C 35.735 18.935 34.818 16.909 33.185 15.416 C 31.551 13.922 29.335 13.085 27.026 13.087 C 24.716 13.085 22.5 13.922 20.867 15.416 C 19.234 16.909 18.317 18.935 18.319 21.047 C 18.317 23.159 19.233 25.186 20.866 26.679 C 22.5 28.173 24.716 29.011 27.026 29.008 C 29.336 29.01 31.551 28.172 33.185 26.679 C 34.818 25.185 35.735 23.159 35.732 21.047 Z M 37.45 21.047 C 37.452 23.576 36.355 26.002 34.4 27.79 C 32.444 29.578 29.791 30.581 27.026 30.579 C 24.26 30.581 21.607 29.578 19.652 27.79 C 17.697 26.002 16.599 23.576 16.602 21.047 C 16.6 18.519 17.697 16.093 19.652 14.305 C 21.608 12.517 24.261 11.514 27.026 11.517 C 29.791 11.514 32.443 12.518 34.398 14.306 C 36.354 16.093 37.451 18.519 37.448 21.047 Z M 27.001 0 C 36.795 0 45.828 5.279 52.062 14.239 C 53.373 16.117 54 18.584 54 21.001 C 54 23.418 53.374 25.883 52.063 27.762 L 52.062 27.761 C 45.828 36.721 36.796 42 27.001 42 C 17.205 42 8.172 36.721 1.937 27.761 C 0.626 25.884 0 23.42 0 21.002 C 0 18.584 0.626 16.118 1.937 14.239 C 8.172 5.28 17.205 0 27.001 0 Z M 27.001 1.57 C 17.935 1.57 9.389 6.455 3.387 15.083 L 3.386 15.084 C 2.293 16.65 1.717 18.801 1.717 21.002 C 1.717 23.064 2.224 25.083 3.186 26.618 L 3.386 26.918 L 3.387 26.918 C 9.389 35.548 17.935 40.431 27.001 40.431 C 36.066 40.431 44.61 35.548 50.613 26.92 L 50.614 26.918 C 51.708 25.353 52.283 23.202 52.283 21.002 C 52.283 18.802 51.708 16.651 50.614 15.085 C 44.61 6.453 36.066 1.57 26.999 1.57 Z" fill="transparent" height="42px" id="PqHH6XccD" transform="translate(1 8)" width="54px"><path d="M 19.13 9.531 C 19.133 7.419 18.216 5.392 16.583 3.899 C 14.949 2.406 12.733 1.568 10.424 1.57 C 8.114 1.568 5.898 2.406 4.265 3.899 C 2.632 5.392 1.715 7.419 1.717 9.531 C 1.715 11.643 2.631 13.669 4.264 15.163 C 5.898 16.656 8.114 17.494 10.424 17.492 C 12.734 17.494 14.949 16.656 16.583 15.162 C 18.216 13.669 19.133 11.643 19.13 9.531 Z M 20.848 9.531 C 20.85 12.059 19.753 14.485 17.798 16.273 C 15.842 18.061 13.189 19.065 10.424 19.062 C 7.658 19.065 5.005 18.061 3.05 16.273 C 1.095 14.485 -0.003 12.059 0 9.531 C -0.002 7.002 1.095 4.576 3.05 2.789 C 5.006 1.001 7.659 -0.002 10.424 0 C 13.189 -0.002 15.841 1.001 17.796 2.789 C 19.752 4.577 20.849 7.002 20.846 9.531 Z" fill="rgb(133, 40, 47)" height="19.06207937188923px" id="jkzLq5dcY" transform="translate(16.602 11.517)" width="20.847538910937974px"/><path d="M 27.001 0 C 36.795 0 45.828 5.279 52.062 14.239 C 53.373 16.117 54 18.584 54 21.001 C 54 23.418 53.374 25.883 52.063 27.762 L 52.062 27.761 C 45.828 36.721 36.796 42 27.001 42 C 17.205 42 8.172 36.721 1.937 27.761 C 0.626 25.884 0 23.42 0 21.002 C 0 18.584 0.626 16.118 1.937 14.239 C 8.172 5.28 17.205 0 27.001 0 Z M 27.001 1.57 C 17.935 1.57 9.389 6.455 3.387 15.083 L 3.386 15.084 C 2.293 16.65 1.717 18.801 1.717 21.002 C 1.717 23.064 2.224 25.083 3.186 26.618 L 3.386 26.918 L 3.387 26.918 C 9.389 35.548 17.935 40.431 27.001 40.431 C 36.066 40.431 44.61 35.548 50.613 26.92 L 50.614 26.918 C 51.708 25.353 52.283 23.202 52.283 21.002 C 52.283 18.802 51.708 16.651 50.614 15.085 C 44.61 6.453 36.066 1.57 26.999 1.57 Z" fill="rgb(133, 40, 47)" height="42px" id="mAnlWpGS6" width="54px"/></g></svg>)
![](data:image/svg+xml,<svg display="block" role="presentation" viewBox="0 0 57 57" xmlns="http://www.w3.org/2000/svg"><g d="M 15.809 0.009 C 16.095 -0.033 16.383 0.075 16.57 0.295 C 16.758 0.515 16.819 0.817 16.732 1.092 C 15.741 4.252 16.587 6.999 17.715 9.736 C 18.265 11.074 18.912 12.473 19.359 13.821 C 19.814 15.191 20.106 16.617 19.924 18.094 C 19.23 23.736 14.248 27.822 8.739 27.146 C 3.229 26.466 -0.613 21.296 0.081 15.656 C 0.689 10.715 4.565 1.637 15.81 0.009 Z M 14.801 1.892 C 5.536 3.834 2.281 11.552 1.751 15.861 C 1.163 20.642 4.417 24.921 8.945 25.477 C 13.472 26.034 17.667 22.67 18.255 17.89 C 18.394 16.762 18.18 15.604 17.764 14.35 C 17.34 13.076 16.75 11.809 16.16 10.376 C 15.139 7.9 14.199 5.098 14.801 1.894 Z M 9.131 15.693 C 9.592 15.745 9.923 16.162 9.871 16.623 C 8.937 24.838 9.72 35.493 14.698 47.583 C 14.875 48.012 14.67 48.503 14.24 48.68 C 13.81 48.856 13.319 48.651 13.142 48.221 C 8.053 35.86 7.235 24.919 8.201 16.432 C 8.253 15.971 8.67 15.64 9.131 15.693 Z M 37.971 18.306 C 43.112 18.206 48.78 20.007 53.784 25.547 C 53.964 25.747 54.038 26.022 53.981 26.286 C 53.925 26.55 53.746 26.77 53.499 26.88 C 49.246 28.751 46.856 32.379 44.732 36.236 C 43.69 38.132 42.685 40.13 41.581 41.872 C 40.468 43.629 39.193 45.228 37.534 46.352 C 31.072 50.737 23.049 48.935 19.728 42.176 C 16.454 35.516 19.059 26.656 25.461 22.313 C 28.32 20.374 32.866 18.405 37.972 18.306 Z M 38.005 19.987 C 33.289 20.076 29.054 21.907 26.405 23.704 C 20.639 27.615 18.363 35.587 21.237 41.435 C 24.062 47.184 30.886 48.831 36.591 44.962 C 37.973 44.024 39.101 42.646 40.16 40.973 C 41.229 39.287 42.172 37.402 43.26 35.426 C 45.238 31.833 47.622 28.076 51.764 25.857 C 47.306 21.341 42.426 19.9 38.003 19.985 Z M 32.045 31.47 C 32.456 31.255 32.965 31.414 33.18 31.826 C 33.395 32.238 33.236 32.745 32.824 32.961 C 25.811 36.625 18.376 42.98 12.234 53.553 C 12.09 53.825 11.808 53.997 11.5 54 C 11.192 54.003 10.906 53.837 10.756 53.568 C 10.607 53.299 10.616 52.97 10.781 52.71 C 17.078 41.867 24.745 35.284 32.045 31.47 Z" fill="transparent" height="54.00000075855835px" id="G8GulGyqu" transform="translate(2 1)" width="54.00000034182602px"><path d="M 15.809 0.009 C 16.095 -0.033 16.383 0.075 16.57 0.295 C 16.758 0.515 16.819 0.817 16.732 1.092 C 15.741 4.252 16.587 6.999 17.715 9.736 C 18.265 11.074 18.912 12.473 19.359 13.821 C 19.814 15.191 20.106 16.617 19.924 18.094 C 19.23 23.736 14.248 27.822 8.739 27.146 C 3.229 26.466 -0.613 21.296 0.081 15.656 C 0.689 10.715 4.565 1.637 15.81 0.009 Z M 14.801 1.892 C 5.536 3.834 2.281 11.552 1.751 15.861 C 1.163 20.642 4.417 24.921 8.945 25.477 C 13.472 26.034 17.667 22.67 18.255 17.89 C 18.394 16.762 18.18 15.604 17.764 14.35 C 17.34 13.076 16.75 11.809 16.16 10.376 C 15.139 7.9 14.199 5.098 14.801 1.894 Z" fill="rgb(133, 40, 47)" height="27.218821543364577px" id="QkyOYuMJs" width="19.978908362357245px"/><path d="M 1.283 0.005 C 1.745 0.058 2.076 0.474 2.023 0.936 C 1.089 9.151 1.872 19.806 6.851 31.895 C 7.027 32.325 6.822 32.816 6.392 32.992 C 5.963 33.169 5.471 32.964 5.295 32.534 C 0.205 20.173 -0.612 9.232 0.353 0.745 C 0.406 0.284 0.822 -0.047 1.283 0.005 Z M 30.123 2.619 C 35.265 2.519 40.933 4.319 45.936 9.859 C 46.117 10.06 46.19 10.335 46.134 10.599 C 46.077 10.862 45.898 11.083 45.652 11.193 C 41.398 13.064 39.008 16.692 36.885 20.549 C 35.842 22.445 34.838 24.443 33.733 26.185 C 32.62 27.942 31.345 29.541 29.686 30.665 C 23.224 35.05 15.202 33.248 11.88 26.489 C 8.606 19.829 11.212 10.969 17.613 6.625 C 20.472 4.687 25.018 2.718 30.124 2.619 Z M 30.157 4.299 C 25.442 4.389 21.206 6.22 18.557 8.017 C 12.791 11.928 10.516 19.9 13.389 25.748 C 16.214 31.496 23.038 33.144 28.743 29.274 C 30.126 28.337 31.253 26.958 32.313 25.285 C 33.381 23.6 34.324 21.714 35.413 19.739 C 37.39 16.145 39.775 12.388 43.916 10.17 C 39.459 5.654 34.579 4.213 30.156 4.298 Z" fill="rgb(133, 40, 47)" height="33.055576356340424px" id="cAughXSID" transform="translate(7.848 15.687)" width="46.15239272921616px"/><path d="M 21.394 0.096 C 21.806 -0.119 22.314 0.04 22.529 0.452 C 22.745 0.863 22.585 1.371 22.174 1.586 C 15.161 5.25 7.726 11.606 1.584 22.179 C 1.439 22.451 1.158 22.622 0.849 22.626 C 0.541 22.629 0.256 22.463 0.106 22.194 C -0.044 21.925 -0.034 21.595 0.131 21.335 C 6.428 10.493 14.095 3.91 21.394 0.096 Z" fill="rgb(133, 40, 47)" height="22.625555797010506px" id="K06sENDqp" transform="translate(10.65 31.374)" width="22.62528744904272px"/></g></svg>)
Warm Nude
#E5D1C4
Deep Garnet
#852930
Dusty Rose
#B46A72
Muted Clay
#CBAAA6
Soft Ivory
#F3E9E3
From High-Fidelity Wireframes to Final UI
To ensure a seamless user experience, the project started with a clear information architecture. I used a focused 3-column grid system to create a balanced layout where the content remains the hero. This approach allowed me to test the messaging and visual hierarchy before adding the final aesthetic layer.
Add to cart
The essence of purity
Discover your ritual
Discover your ritual
Discover your ritual
Discover your ritual
Your email
Your email
Your email
Your email
Search
Architecture & Scalability
The project is built using SCSS and the BEM methodology, ensuring a clean, modular, and conflict-free stylesheet architecture. This approach allows for easy maintenance and scalability of the design system.
Folder Structure & Logic
A strictly organized file structure separates global styles, variables, and independent components (blocks).
Deployment & Hosting
The project is deployed on Vercel, leveraging a modern CI/CD pipeline for instant updates and high-performance content delivery via their Global Edge Network.
Performance Benchmarks
The website is optimized for speed and accessibility. It achieves a near-perfect 99%+ score on Desktop and a solid 81%+ on Mobile via Google PageSpeed Insights, balancing rich visuals with fast loading times.
Mobile-First Approach
Layout Fluidity
