MarkdownPlus

Icons

MarkdownPlus supports using icons.

Syntax

:icon-name:

Example

Icon: :diamond:

Icon:

 

Icons are implemented as inline-SVG and adopt the surrounding text color (red in the example above).

Styling

CSS variables ready to use:

  • --mdp-icon-size
  • --mdp-icon-angle

Examples

css: body { --mdp-icon-size: 2em; }

Icon:

css: body { --mdp-icon-angle: 60deg; }

Icon:

Disable Icon Rendering

If desired, you can disable this feature via site/config/config.php:

'pgfactory.markdownplus.options' => ['enableIcons' => false],

Available Icons

:airplay:

:alarm_clock:

:align_horizontal:

:align_vertical:

:angle:

:archive:

:arrow_bottom_left:

:arrow_bottom_right:

:arrow_down_circle:

:arrow_down:

:arrow_left_circle:

:arrow_left:

:arrow_right_circle:

:arrow_right:

:arrow_top_left:

:arrow_top_right:

:arrow_up_circle:

:arrow_up:

:audio_wave:

:backspace:

:backward:

:bag:

:battery_75:

:battery_charging:

:battery_empty:

:battery_full:

:battery_half:

:battery_low:

:bell_disabled:

:bell_ringing:

:bell_snooze:

:bell:

:bluetooth:

:book_closed:

:bookmark_book:

:bookmark:

:book:

:book_text:

:box_download:

:box_open:

:box:

:branch:

:briefcase:

:browser_alt:

:browser:

:button_add:

:button_minus:

:calculator:

:calendar_add:

:calendar_date:

:calendar_days:

:calendar_day:

:calendar_last_day:

:calendar_month:

:calendar_move:

:calendar_remove:

:calendar_split:

:calendar:

:calendar_week:

:camera_alt:

:camera_noflash_alt:

:camera_noflash:

:camera:

:capture:

:card_timeline:

:card_view:

:carousel:

:cart:

:cast:

:chain:

:chat_add:

:checkbox_checked:

:checkbox_empty:

:check_circle_outside:

:check_circle:

:check:

:chevron_close:

:chevron_down_circle:

:chevron_down_double:

:chevron_down:

:chevron_left_circle:

:chevron_left_double:

:chevron_left:

:chevron_open:

:chevron_right_circle:

:chevron_right_double:

:chevron_right:

:chevron_up_circle:

:chevron_up_double:

:chevron_up:

:circle_menu:

:circle_split:

:circle:

:clipboard_add:

:clipboard_check:

:clipboard_copy:

:clipboard_cross:

:clipboard_notes:

:clipboard_remove:

:clipboard:

:clock:

:close:

:cloud_disconnect:

:cloud_download_alt:

:cloud_download:

:cloud:

:cloud_upload_alt:

:cloud_upload:

:code:

:coffee:

:coins:

:coin:

:compass:

:component_add:

:contacts:

:contract:

:create:

:credit_card:

:crop:

:cross_circle:

:crosshair:

:cross:

:cube:

:cylinder:

:database:

:diamond:

:directions:

:disc:

:display_alt:

:display:

:document_justified:

:document_list:

:document_stack:

:document:

:document_words:

:door_alt:

:door:

:download_alt:

:download:

:downward:

:drag_circle:

:drag:

:drag_vertical:

:duplicate_alt:

:duplicate:

:edit:

:enter_alt:

:enter:

:episodes:

:exit_left:

:exit_right:

:expand_height:

:expand:

:expand_width:

:external:

:eye_closed:

:eye_no:

:eye:

:face_delighted:

:face_happy:

:face_neutral:

:face_sad:

:file_download:

:files_history:

:files_multi:

:files_stack:

:file_upload:

:film:

:filter_circle:

:filtering:

:filter_single:

:filter:

:fingerprint:

:flag:

:flame_alt:

:flame:

:flip_view:

:floppy:

:folder_add:

:folder_closed:

:folder_minus:

:folder_open:

:fork_git:

:forward:

:frame:

:fullscreen:

:funnel:

:gauge:

:geo:

:gift:

:globe:

:gps:

:grab:

:graph_bar:

:graph_box:

:graph_increase:

:grid_circles_add:

:grid_circles:

:grid_small:

:grid_squares_add:

:grid_squares:

:grid:

:hand:

:harddrive:

:hash:

:heart_rate:

:heart_remove:

:heart:

:height:

:hierarchy:

:home_alt:

:home_check:

:home_door:

:home:

:import:

:inbox_alt:

:inbox:

:info_circle:

:iphone_landscape:

:iphone_portrait:

:jump_backward:

:jump_forward:

:jump_left:

:jump_right:

:keyboard:

:laptop:

:lightbulb_on:

:lightbulb:

:lightning_alt:

:lightning:

:lineweight:

:link_alt:

:link_broken:

:link_horizontal:

:link:

:link_vertical:

:list_add:

:list_numbered:

:list:

:loader:

:location:

:lock_open:

:lock:

:login:

:logout:

:mail_add:

:mail_delete:

:mail_minus:

:mail_new:

:mail_open:

:mail_remove:

:mail_send:

:mail:

:map:

:marquee:

:maximise:

:menu_hamburger:

:menu_horizontal:

:menu_vertical:

:message:

:message_writing:

:microphone_disabled:

:microphone_muted:

:microphone:

:midpoint:

:minimise:

:mini_player:

:minus_circle:

:minus:

:mobile:

:moon:

:move:

:newspaper:

:no_sign:

:notebook:

:notification:

:nut:

:pages:

:panel_bottom:

:panel_center:

:panel_left:

:panel_right:

:panel_sectioned:

:panel_top:

:paperclip:

:paper_folded:

:paper_plane_alt:

:paper_plane:

:paper:

:paragraph_center:

:paragraph_end:

:paragraph_left:

:paragraph_right:

:paragraph_start:

:pdf:

:pen:

:phone_landscape:

:phone_portrait:

:picture:

:pie_half:

:pie_quarter:

:pie_third:

:play_button:

:play:

:plus_circle:

:plus:

:postcard:

:printer:

:projector:

:pull_down:

:pull_left:

:pull_right:

:pull_up:

:push_down:

:push_left:

:push_right:

:push_up:

:question_circle:

:radio_on:

:receipt:

:record:

:redo:

:refresh_alt:

:refresh:

:replicate_alt:

:replicate:

:reset_alt:

:reset_forward:

:reset_hard:

:reset:

:reset_temporary:

:retweet:

:reuse:

:reverse_alt:

:reverse:

:revert:

:rocket:

:ruler:

:scale_contract:

:scale_extend:

:scale:

:scalpel:

:search:

:server:

:settings:

:share_alt:

:share:

:shuffle:

:side_menu:

:slash_backward:

:slash_forward:

:sliders:

:sms:

:sort_alt:

:sort:

:speaker:

:speech_bubble:

:speech_typing:

:split:

:split_three:

:star:

:sun:

:support:

:swap:

:switch:

:table_header:

:table:

:tag_milestone:

:tags:

:tag:

:target:

:tel:

:text:

:thread:

:thumbs_down:

:thumbs_up:

:ticket:

:timeline:

:todo:

:toggles:

:toggle:

:translate:

:trash_alt:

:trash:

:trophy:

:tv_mode:

:unarchive:

:undo_history:

:undo:

:unlink_horizontal:

:unlink_vertical:

:upload_alt:

:upload:

:upward:

:user_add:

:user_circle:

:user_male_circle:

:user_male:

:user_remove:

:users:

:user:

:venn:

:versions:

:version:

:video:

:volume_0:

:volume_add:

:volume_disabled:

:volume_high:

:volume_low:

:volume_minus:

:volume_muted:

:wallet:

:warning_circle:

:warning_hex:

:warning_triangle:

:waves:

:width:

:wifi_error:

:wifi_none:

:wifi:

:window_collapse_left:

:window_collapse_right:

:window_content:

:window:

:wrap_back:

:wrap_forward:

:write:

:zoom_cancel:

:zoom_in:

:zoom_out:

:zoom_reset:

 

Attribution:

This is the set of free svg-icons available from System UIcons by Corey Ginnivan.

MarkdownPlus