Opciones
Iconos
Claro que tenemos iconos, pero recuerda usarlos solamente cuando exista una necesidad clara de ellos en nuestras interfaces. Los iconos han de tener un intención y un significado claro.
Uso
Si ya tienes decidido el uso de nuestros iconos, perfecto. Pero déjanos recordarte en que usos pensamos para ellos
Consumible en Figma
El equipo de diseño puede consumir los iconos de PluralDS desde una librería en Figma versionada.
Usamos Keyicons
Como base usamos un set de iconos free. Se trata de , un desarrollo gratuito de iconos que están muy limpios y bien clasificados, dicho esto nosotros también hemos hecho algo de trabajo y muchos iconos nuevos. Los iconos están distribuidos en una librería de Figma que tiene marcados los siguientes tamaños y categorías…
Tamaño: XS = 16px, S = 24px, M = 32px, L = 40px, XL = 56px
Smart Stroke
Todos los iconos están ajustados dentro de una “icon line smart stroke”. Estas líneas que soportan la estructura y proporción de nuestros iconos ayudan también en el redimensionamiento de los iconos. En esta imagen puedes ver el armazon horizontal, vertical, cuadado y esférico que soportan cada uno de los iconos incluidos en PluralDS.
Tageado de iconos
Todos los iconos además de un Title (nombre) tienen asociados un conjunto de tags que ayudan en su consumo por parte de los diseñadores. No hace falta que conozcas el Title (nombre) específico para encontrarlo dentro de tu herramienta de diseño (figma). En el buscador de assets puedes buscar conceptos asociados al icono que quieres encontrar y tienes altas posibilidades de poder acertar. Estos tags están disponibles tanto en castellano como en inglés.
Idioma
Conceptos
Tags castellano
añadir, agregar, incorporar, acrecentar, adicionar, ampliar, anexionar, aumentar, incrementar, integrar, sumar,
Tags inglés
calculate, count, enumerate, summate, sum, inclusion, adding, adjoinin
There are no rows in this table
Librería de iconos
Acciones
Ico
Title
Token Name
add
–icon-add
add-circle
–add-circle
adjustment
–adjustment
bookmark
–bookmark
check
–check
check circle
–check-circle
close
–close
close circle
–close-circle
copy
–copy
download 1
–download-1
download 2
–download-2
download 3
–download-3
eye
–eye
heart
–heart
hamburger
-hamburger
join
–join
leave
–leave
link
–link
link external
–link-external
lock
–lock
maximize
–maximize
minimize
–minimize
paper clip
–paper-clip
save
–save
search
–search
send
–send
settings
–setting
star
–star
subtract
transfer
–transfer
trash
–trash
unlock
–unlock
upload-1
–upload-1
upload-2
–upload-2
upload-3
–upload-3
zoom-in
–zoom-in
zoom-out
-zoom-out
There are no rows in this table
Alertas
Ico
Title
Token Name
alert
–alert
blocked
–blocked
bell
–bell
info
–info
help
–help
There are no rows in this table
Comunicación
Ico
Title
Token Name
call-during
–call-during
call-incoming
–call-incoming
call-missed
–call-missed
call-off
–call-off
call-outgoing
–call-outgoing
code
–code
mail
–mail
map-pin
–map-pin
message-bubble
–message-bubble
message
–message
phone
–phone
share
–share
wifi
–wifi
There are no rows in this table
Contenido
Ico
Title
Token Name
activity
–activity
analytics
–analytics
award
–award
bar-chart-1
–bar-chart-1
bar-chart-2
–bar-chart-2
book
–book
calendar
–calendar
clock
–clock
coffee
–coffee
credit-card
–credit-card
file-audio
–file-audio
file-code
–file-code
file-generic
–file-generic
file-jpg
–file-jpg
file-new
–file-new
file-png
–file-png
file-svg
–file-svg
file-video
–file-video
filter
–filter
flag
–flag
folder-minus
–folder-minus
folder-plus
–folder-plus
folder
–folder
gift
–gift
globe
–globe
grid
–grid
home
–home
layers
–layers
map
–map
money
–money
moon
–moon
navigation
–navigation
percentage
–percentage
pie-chart
–pie-chart
sad-face
–sad-face
shop
–shop
shoping-bag-2
–shoping-bag-2
shoping-bag-3
–shoping-bag-3
shoping-bag
–shoping-bag
shoping-cart
–shoping-cart
smiley-face
–smiley-face
tag
–tag
tags
–tags
target
–target
trending-down
–trending-down
user-x
–user-x
user
–user
users
–users
There are no rows in this table
Editor
Ico
Title
Token Name
align-center
–align-center
align-justify
–align-justify
align-left
–align-left
align-right
–align-right
bullet-list
–bullet-list
edit
–edit
font-color
–font-color
list-numbered
–list-numbered
list
–list
pen-tool
–pen-tool
scissors
–scissors
text-bold
–text-bold
text-italic
–text-italic
text-strikethrough
–text-strikethrough
text-underline
–text-underline
There are no rows in this table
Key
Ico
Title
Token Name
chrome
–chrome
codepen
–codepen
facebook
–facebook
figma
–figma
gem
–gem
gitlab
–gitlab
instagram
–instagram
keyicons
–keyicons
linkedin
–linkedin
party
–party
premio
–premio
sketch
–sketch
trello
–trello
twitch
–twitch
twitter
–twitter
youtube
–youtube
There are no rows in this table
Multimedia
Ico
Title
Token name
camera
–camera
cpu
–cpu
database
–database
desktop
–desktop
equalizer
–equalizer
fast-forwar
–fast-forwar
headphones
–headphones
image
–image
lightning-bolt
–lightning-bolt
mic
–mic
mobile
–mobile
music
–music
next
–next
pause
–pause
play
–play
playlist
–playlist
previous
–previous
printer
–printer
reload
–reload
repeat-play
–repeat-play
rewind
–rewind
rotate-left
–rotate-left
shuffle-play
–shuffle-play
sound
–sound
stop
–stop
streaming
–streaming
tv
–tv
video-off
–video-off
video
–video
volume-minus
–volume-minus
volume-off
–volume-off
volume-plus
–volume-plus
There are no rows in this table
Navigation
Ico
Title
Token Name
arrow-down
–arrow-down
arrow-left
–arrow-left
arrow-right
–arrow-right
arrow-up
–arrow-up
chevron-down
–chevron-down
chevron-left
–chevron-left
chevron-right
–chevron-right
chevron-up
–chevron-up
There are no rows in this table
Want to print your doc?
This is not the way.
This is not the way.
Try clicking the ⋯ next to your doc name or using a keyboard shortcut (
CtrlP
) instead.