Skip to content

feat: sync icons from Figma #739

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We鈥檒l occasionally send you account related emails.

Already on GitHub? Sign in to your account

Open
github-actions wants to merge 1 commit into
base: main
Choose a base branch
from
Open

feat: sync icons from Figma #739

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
7 changes: 7 additions & 0 deletions .changeset/sync-icons-20260910070701.md
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,7 @@
---
"@vapor-ui/icons": patch
---

Update icons from Figma

**Updated Symbol Icons:** `InstagramIcon`, `InstagramColorIcon`
6 changes: 3 additions & 3 deletions packages/icons/src/components/symbol-icons/InstagramColorIcon/InstagramColorIcon.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -16,7 +16,7 @@ const InstagramColorIcon = (props: IconProps) => (
>
<path
fill="#858899"
d="M8 2.261c1.869 0 2.09.008 2.828.041.683.031 1.053.145 1.3.241.327.127.56.279.805.524s.397.478.523.805c.096.246.21.617.241 1.3.034.737.041.959.041 2.828s-.007 2.09-.04 2.828c-.032.683-.146 1.054-.242 1.3a2.2 2.2 0 0 1-.523.805 2.2 2.2 0 0 1-.805.524c-.247.095-.617.21-1.3.24-.738.034-.96.041-2.828.041-1.87 0-2.091-.007-2.829-.04-.682-.032-1.053-.146-1.3-.241a2.2 2.2 0 0 1-.805-.524 2.2 2.2 0 0 1-.523-.805c-.096-.246-.21-.617-.241-1.3-.034-.737-.04-.959-.04-2.828 0-1.87.006-2.09.04-2.829.031-.682.145-1.053.24-1.3.128-.326.28-.56.524-.804.245-.245.479-.397.805-.524.247-.096.618-.21 1.3-.24.738-.034.96-.042 2.829-.042m0-1.26c-1.901 0-2.14.007-2.886.042-.745.033-1.254.152-1.7.325-.46.179-.85.418-1.24.807a3.4 3.4 0 0 0-.806 1.24c-.174.445-.292.954-.326 1.699S1 6.099 1 8s.008 2.14.042 2.886c.034.745.152 1.254.326 1.699.179.46.418.85.807 1.24.39.389.78.628 1.24.807.445.173.954.292 1.699.326S6.099 15 8 15c1.9 0 2.14-.008 2.886-.042.745-.034 1.254-.153 1.699-.326.46-.179.85-.418 1.24-.807.389-.39.628-.78.807-1.24.173-.445.292-.954.325-1.7C14.993 10.14 15 9.902 15 8s-.008-2.14-.043-2.886c-.033-.745-.152-1.254-.325-1.7a3.4 3.4 0 0 0-.807-1.239 3.4 3.4 0 0 0-1.24-.807c-.446-.173-.955-.292-1.7-.325C10.14 1.008 9.902 1 8 1"
d="M8 2.262c1.869 0 2.09.007 2.828.04.683.031 1.053.145 1.3.241.327.127.56.279.805.524s.397.478.523.805c.096.246.21.617.241 1.3.034.737.041.959.041 2.828 0 1.87-.007 2.09-.04 2.829-.032.682-.146 1.053-.242 1.3-.127.326-.278.56-.523.804a2.2 2.2 0 0 1-.805.524c-.247.096-.617.21-1.3.24-.738.034-.96.042-2.828.042-1.87 0-2.091-.008-2.829-.041-.682-.031-1.053-.145-1.3-.241a2.2 2.2 0 0 1-.805-.524 2.2 2.2 0 0 1-.523-.805c-.096-.246-.21-.617-.241-1.3-.034-.737-.04-.959-.04-2.828 0-1.87.006-2.09.04-2.828.031-.683.145-1.054.24-1.3.128-.327.28-.56.524-.805.245-.245.479-.397.805-.524.247-.096.618-.21 1.3-.24.738-.034.96-.041 2.829-.041M8 1c-1.901 0-2.14.008-2.886.043-.745.033-1.254.152-1.7.325-.46.179-.85.418-1.24.807a3.4 3.4 0 0 0-.806 1.24c-.174.445-.292.954-.326 1.699C1.008 5.861 1 6.099 1 8s.008 2.14.042 2.886c.034.745.152 1.254.326 1.7.179.46.418.85.807 1.239s.78.629 1.24.808c.445.173.954.29 1.699.325.746.034.985.042 2.886.042 1.9 0 2.14-.008 2.886-.042.745-.034 1.254-.152 1.699-.325.46-.18.85-.419 1.24-.808.389-.39.628-.78.807-1.24.173-.445.292-.954.325-1.699C14.993 10.14 15 9.901 15 8s-.008-2.14-.043-2.886c-.033-.745-.152-1.254-.325-1.7a3.4 3.4 0 0 0-.807-1.239 3.4 3.4 0 0 0-1.24-.807c-.446-.173-.955-.292-1.7-.325C10.14 1.008 9.902 1 8 1"
/>
<path
fill="#858899"
Expand All @@ -26,7 +26,7 @@ const InstagramColorIcon = (props: IconProps) => (
<g mask="url(#vapor-icons-color-InstagramColorIcon__a)">
<path
fill="url(#vapor-icons-color-InstagramColorIcon__b)"
d="M8 20c6.627 0 12-5.373 12-12S14.627-4 8-4-4 1.373-4 8 1.373 20 8 20"
d="M8 20c6.627 0 12-5.372 12-12C20 1.373 14.627-4 8-4S-4 1.373-4 8c0 6.628 5.373 12 12 12"
/>
</g>
<defs>
Expand All @@ -35,7 +35,7 @@ const InstagramColorIcon = (props: IconProps) => (
cx={0}
cy={0}
r={1}
gradientTransform="translate(1.17 19.17)scale(26.8062)"
gradientTransform="matrix(26.8062 0 0 26.8066 1.17 19.17)"
gradientUnits="userSpaceOnUse"
>
<stop offset={0.09} stopColor="#FA8F21" />
Expand Down
6 changes: 1 addition & 5 deletions packages/icons/src/components/symbol-icons/InstagramIcon/InstagramIcon.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -5,11 +5,7 @@ const InstagramIcon = (props: IconProps) => (
<IconBase xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 16 16" {...props}>
<path
fill="currentColor"
d="M8 2.261c1.869 0 2.09.008 2.828.041.683.031 1.053.145 1.3.241.327.127.56.279.805.524s.397.478.523.805c.096.246.21.617.241 1.3.034.737.041.959.041 2.828s-.007 2.09-.04 2.828c-.032.683-.146 1.054-.242 1.3-.127.327-.278.56-.523.805a2.2 2.2 0 0 1-.805.524c-.247.095-.617.21-1.3.24-.738.034-.96.041-2.828.041-1.87 0-2.091-.007-2.829-.04-.682-.032-1.053-.146-1.3-.241a2.2 2.2 0 0 1-.805-.524 2.2 2.2 0 0 1-.523-.805c-.096-.246-.21-.617-.241-1.3-.034-.737-.04-.959-.04-2.828 0-1.87.006-2.09.04-2.829.031-.682.145-1.053.24-1.3.128-.326.28-.56.524-.804.245-.245.479-.397.805-.524.247-.096.618-.21 1.3-.24.738-.034.96-.042 2.829-.042m0-1.26c-1.901 0-2.14.007-2.886.042-.745.033-1.254.152-1.7.325-.46.179-.85.418-1.24.807a3.4 3.4 0 0 0-.806 1.24c-.174.445-.292.954-.326 1.699S1 6.099 1 8s.008 2.14.042 2.886c.034.745.152 1.254.326 1.699.179.46.418.85.807 1.24.39.389.78.628 1.24.807.445.173.954.292 1.699.326S6.099 15 8 15c1.9 0 2.14-.008 2.886-.042.745-.034 1.254-.153 1.699-.326a3.4 3.4 0 0 0 1.24-.807c.389-.39.628-.78.807-1.24.173-.445.292-.954.325-1.699.035-.747.043-.985.043-2.886s-.008-2.14-.043-2.886c-.033-.745-.152-1.254-.325-1.7a3.4 3.4 0 0 0-.807-1.239 3.4 3.4 0 0 0-1.24-.807c-.446-.173-.955-.292-1.7-.325C10.14 1.008 9.902 1 8 1"
/>
<path
fill="currentColor"
d="M8 4.406a3.594 3.594 0 1 0 0 7.188 3.594 3.594 0 0 0 0-7.188m0 5.927a2.333 2.333 0 1 1 0-4.666 2.333 2.333 0 0 1 0 4.666m3.736-5.23a.84.84 0 1 0 0-1.68.84.84 0 0 0 0 1.68"
d="M8 1c1.9 0 2.14.009 2.886.043.745.034 1.253.151 1.699.324.46.18.85.419 1.24.808s.628.78.807 1.24c.173.445.291.954.325 1.7S15 6.098 15 8s-.009 2.14-.043 2.886c-.034.745-.152 1.254-.325 1.699a3.4 3.4 0 0 1-.807 1.24 3.4 3.4 0 0 1-1.24.808c-.445.173-.954.291-1.7.325S9.902 15 8 15s-2.14-.008-2.886-.042c-.744-.034-1.254-.152-1.699-.325a3.4 3.4 0 0 1-1.24-.808 3.4 3.4 0 0 1-.808-1.24c-.173-.445-.291-.955-.325-1.7S1 9.902 1 8s.008-2.14.042-2.886c.034-.745.152-1.254.325-1.699.179-.46.419-.85.808-1.24a3.4 3.4 0 0 1 1.24-.807c.444-.173.954-.291 1.698-.325C5.86 1.009 6.1 1 8 1m0 1.262c-1.87 0-2.09.007-2.83.04-.681.032-1.052.145-1.299.241-.327.127-.56.278-.805.523a2.2 2.2 0 0 0-.523.806c-.096.247-.21.618-.241 1.3-.034.738-.041.96-.041 2.828 0 1.87.007 2.091.04 2.83.032.681.146 1.052.242 1.299.127.326.278.56.523.805.245.244.478.396.805.523.247.096.618.21 1.3.241.738.034.96.04 2.829.04s2.09-.006 2.828-.04c.683-.03 1.053-.145 1.3-.241.327-.127.56-.279.805-.523.244-.245.396-.479.523-.805.096-.247.21-.618.241-1.3.034-.738.041-.96.041-2.829s-.007-2.09-.04-2.828c-.032-.682-.146-1.053-.242-1.3a2.2 2.2 0 0 0-.523-.806 2.2 2.2 0 0 0-.805-.523c-.247-.096-.618-.21-1.3-.24-.738-.034-.96-.041-2.828-.041m0 2.143a3.595 3.595 0 1 1-.002 7.19A3.595 3.595 0 0 1 8 4.404m0 1.262a2.334 2.334 0 1 0 0 4.668 2.334 2.334 0 0 0 0-4.668m3.736-2.243a.84.84 0 1 1 0 1.68.84.84 0 0 1 0-1.68"
/>
</IconBase>
);
Expand Down