HERRAMIENTAS

Iconos Tipográficos para utilizar en tu web con CSS

Si eres diseñador web ya conoces las tipografías de iconos o iconos tipográficos. Hay varias tipografías con iconos que puedes utilizar, y depende del theme que utilices en tu WordPress, Joomla, Prestashop, etc tendrá implementado uno u otro. La mejor opción es utilizar la tipografía de iconos que viene «de serie» en cada theme, pero si además quieres usar otro te muestro a continuación los que más utilizo.

 

Dashicon

Es la tipografía de iconos oficial del administrador de WordPress. Tiene 303 iconos.

Puedes ver todos los iconos en https://developer.wordpress.org/resource/dashicons/#wordpress

Cómo meter iconos en mi web

  • Copia en tu página el código HTML del icono que te interesa, por ejemplo:

<span class=»dashicons dashicons-wordpress»></span>

  • O puedes hacerlo mediante CSS, añadiendo en tu class: content: «\f120»;
    • Por ejemplo: .icono-logo-wordpress:after{content: «\f120»;}

 

Menú de administrador | Admin menu

f333
f228
f329
f349
f319
f11d
f11e
f11f
f226
f109
f104
f105
f101
f100
f106
f485
f110
f107
f108
f112
f102
f111
f148
f536
f540
f541

Pantalla de bienvenida

f119
f133
f115
f116
f117
f118

Formatos de publicaciones

f123
f128
f126
f130
f122
f125
f127
f306
f129
f232
f233
f234
f235
f236

Media

f501
f500
f499
f498
f497
f496
f495
f491
f490
f492
f493
f522
f523
f519
f517
f518
f516
f515
f521
f520

Edición de imagen

f165
f531
f166
f167
f168
f169
f533
f171
f172

TinyMCE

f200
f201
f203
f204
f12c
f205
f206
f207
f208
f209
f210
f211
f506
f212
f213
f214
f215
f216
f217
f218
f219
f220
f221
f222
f223
f224
f320
f10c
f474
f475
f476
f535

Pantalla de publicaciones

f135
f136
f134
f138
f160
f528
f145
f508
f177
f530
f173
f464
f182
f537

Clasificación

f504
f142
f140
f139
f141
f342
f346
f344
f340
f343
f347
f345
f341
f156
f229
f503
f163
f164
f509
f545

Social

f237
f240
f242
f301
f302
f303
f465
f466
f467
f304
f305
f462
f325
f12d

WordPress.org específico: trabajos, perfiles, WordCamps

f308
f309
f310
f311
f483
f507
f486
f484
f481
f487
f488
f489
f10d
f124
f13a

Iconos de BuddyPress y BBPress

f452
f453
f449
f454
f456
f457
f451
f450
f455

Products

f120
f324
f157
f463
f113
f180
f348
f174
f175
f176
f326

Taxonomies

tag
f318

Widgets

f480
f479
f478

Notificaciones

f147
f12a
f158
f335
f132
f502
f543
f460
f153
f159
f155
f459
f154
f227
f534

Varios

f230
f231
f178
f332
f334
f468
f181
f121
f183
f184
f185
f238
f239
f307
f338
f12f
f12e
f336
f337
f312
f313
f314
f473
f322
f330
f331
f316
f317
f321
f469
f339
f482
f472
f547
f471
f470
f525
f510
f511
f512
f513
f514
f527
f524
f526
f328
f529
f542
f538
f546
f131
f327