Custom Social Icons

Hi Jason,
For the Twenty Twenty-One theme, you can add custom icons by adding the following PHP code in your child theme:

function theme_custom_social_svg( $icons ) {
	
	$icons['vsco'] = '<svg width="24" height="24" viewBox="0 0 100 100" version="1.1" xmlns="https://www.w3.org/2000/svg"><path d="M50,0a50,50,0,1,0,50,50A50.06,50.06,0,0,0,50,0ZM98,50a48.39,48.39,0,0,1-.25,4.92l-8.49-1c.12-1.27.19-2.57.19-3.87s-.06-2.45-.18-3.66l8.49-1C98,46.87,98,48.42,98,50ZM2,50a48.38,48.38,0,0,1,.24-4.84l8.49,1c-.12,1.25-.19,2.52-.19,3.8s.07,2.55.19,3.8l-8.49,1Q2,52.44,2,50ZM87.3,37.07l8-3a47.63,47.63,0,0,1,2.26,9.32l-8.49,1A39.14,39.14,0,0,0,87.3,37.07ZM87.53,50a37.55,37.55,0,0,1-.72,7.3L78.4,55.36a28.71,28.71,0,0,0,0-10.94l8.42-1.9A37.56,37.56,0,0,1,87.53,50ZM50,76.94A26.94,26.94,0,1,1,76.94,50,27,27,0,0,1,50,76.94Zm.91,10.56,0-8.63a28.7,28.7,0,0,0,10.74-2.45l3.73,7.78A37.27,37.27,0,0,1,50.91,87.51ZM34.49,84.16l3.75-7.77A28.7,28.7,0,0,0,49,78.88l0,8.62A37.27,37.27,0,0,1,34.49,84.16ZM12.47,50a37.55,37.55,0,0,1,.77-7.6l8.41,1.93a28.74,28.74,0,0,0-.07,10.94l-8.42,1.91A37.55,37.55,0,0,1,12.47,50ZM49,12.5v8.63a28.7,28.7,0,0,0-10.59,2.4l-3.74-7.77A37.27,37.27,0,0,1,49,12.5ZM65.43,15.8l-3.77,7.76A28.7,28.7,0,0,0,51,21.12V12.5A37.27,37.27,0,0,1,65.43,15.8ZM86.62,35.24a39.4,39.4,0,0,0-3.48-6.68l7-4.84a47.94,47.94,0,0,1,4.44,8.51Zm-.27,5.38-8.43,1.9a28.82,28.82,0,0,0-4.76-9.8l6.76-5.35A37.41,37.41,0,0,1,86.34,40.62ZM71.92,31.19a29.08,29.08,0,0,0-8.5-6.78l3.77-7.76a37.76,37.76,0,0,1,11.49,9.17ZM69.41,15.63l4-7.56a48.24,48.24,0,0,1,7.87,5.51L75.59,20A39.67,39.67,0,0,0,69.41,15.63Zm-1.73-.92a39.2,39.2,0,0,0-7-2.73l2.07-8.3a47.69,47.69,0,0,1,9,3.47Zm-8.95-3.21a39.4,39.4,0,0,0-7.62-1V2A47.94,47.94,0,0,1,60.8,3.2Zm-9.58-1a39.44,39.44,0,0,0-7.52.88l-2-8.3A48,48,0,0,1,49.16,2Zm-9.43,1.34a39.2,39.2,0,0,0-7.1,2.67L28.66,7a47.68,47.68,0,0,1,9-3.41Zm-8.83,3.58a39.65,39.65,0,0,0-6.25,4.3L19,13.36a48.23,48.23,0,0,1,7.94-5.48Zm2,1.14,3.74,7.77a29.08,29.08,0,0,0-8.52,6.75l-6.74-5.38A37.76,37.76,0,0,1,32.93,16.6ZM20.17,27.26l6.74,5.38a28.82,28.82,0,0,0-4.8,9.78l-8.42-1.93A37.41,37.41,0,0,1,20.17,27.26ZM13.46,35l-8-3A48,48,0,0,1,10,23.47l7,4.86A39.42,39.42,0,0,0,13.46,35Zm-.7,1.83a39.15,39.15,0,0,0-1.83,7.37l-8.48-1a47.63,47.63,0,0,1,2.32-9.38ZM10.93,55.74a39.14,39.14,0,0,0,1.83,7.37l-8,3a47.63,47.63,0,0,1-2.31-9.37Zm2.52,9.21A39.42,39.42,0,0,0,17,71.66l-7,4.85A48,48,0,0,1,5.46,68Zm.13-5.86L22,57.18a28.8,28.8,0,0,0,4.71,9.91L20,72.46A37.4,37.4,0,0,1,13.59,59.09Zm14.33,9.54a29.09,29.09,0,0,0,8.55,6.91L32.72,83.3A37.77,37.77,0,0,1,21.17,74Zm2.94,15.9-4,7.57A48.23,48.23,0,0,1,19,86.62l5.67-6.39A39.65,39.65,0,0,0,30.87,84.53Zm1.74.91a39.2,39.2,0,0,0,7.08,2.67l-2.06,8.3a47.68,47.68,0,0,1-9-3.41Zm9,3.14a39.44,39.44,0,0,0,7.51.89V98a48,48,0,0,1-9.55-1.14Zm9.47.88a39.41,39.41,0,0,0,7.5-.92l2,8.3A48,48,0,0,1,51,98Zm9.4-1.39a39.2,39.2,0,0,0,7.05-2.69l4,7.57a47.68,47.68,0,0,1-9,3.43Zm8.78-3.61a39.65,39.65,0,0,0,6.2-4.29l5.65,6.41A48.24,48.24,0,0,1,73.21,92Zm-2.09-1.11-3.73-7.78A29.08,29.08,0,0,0,72,68.7l6.73,5.39A37.76,37.76,0,0,1,67.16,83.36ZM80,72.56l-6.73-5.39A28.81,28.81,0,0,0,78,57.28l8.41,1.94A37.4,37.4,0,0,1,80,72.56ZM86.54,65l8,3A48,48,0,0,1,90,76.49l-7-4.87A39.42,39.42,0,0,0,86.54,65Zm.7-1.83a39.14,39.14,0,0,0,1.82-7.31l8.48,1a47.63,47.63,0,0,1-2.31,9.31Zm1.83-41-7,4.84a39.8,39.8,0,0,0-5-5.67l5.68-6.38A48.41,48.41,0,0,1,89.07,22.1ZM17.51,14.65l5.67,6.4a39.81,39.81,0,0,0-5,5.67l-7-4.86A48.43,48.43,0,0,1,17.51,14.65ZM11.08,78.12l7-4.85a39.81,39.81,0,0,0,5,5.66l-5.68,6.39A48.43,48.43,0,0,1,11.08,78.12Zm71.48,7.16-5.66-6.41a39.81,39.81,0,0,0,5-5.64l7,4.87A48.43,48.43,0,0,1,82.57,85.28Z"></path></svg>';
	
	$icons['imdb'] = '<svg width="24" height="24" viewBox="0 0 448 512" version="1.1" xmlns="https://www.w3.org/2000/svg"><path d="M89.5 323.6H53.93V186.2H89.5V323.6zM156.1 250.5L165.2 186.2H211.5V323.6H180.5V230.9L167.1 323.6H145.8L132.8 232.9L132.7 323.6H101.5V186.2H147.6C148.1 194.5 150.4 204.3 151.9 215.6L156.1 250.5zM223.7 323.6V186.2H250.3C267.3 186.2 277.3 187.1 283.3 188.6C289.4 190.3 294 192.8 297.2 196.5C300.3 199.8 302.3 203.1 303 208.5C303.9 212.9 304.4 221.6 304.4 234.7V282.9C304.4 295.2 303.7 303.4 302.5 307.6C301.4 311.7 299.4 315 296.5 317.3C293.7 319.7 290.1 321.4 285.8 322.3C281.6 323.1 275.2 323.6 266.7 323.6H223.7zM259.2 209.7V299.1C264.3 299.1 267.5 298.1 268.6 296.8C269.7 294.8 270.4 289.2 270.4 280.1V226.8C270.4 220.6 270.3 216.6 269.7 214.8C269.4 213 268.5 211.8 267.1 210.1C265.7 210.1 263 209.7 259.2 209.7V209.7zM316.5 323.6V186.2H350.6V230.1C353.5 227.7 356.7 225.2 360.1 223.5C363.7 222 368.9 221.1 372.9 221.1C377.7 221.1 381.8 221.9 385.2 223.3C388.6 224.8 391.2 226.8 393.2 229.5C394.9 232.1 395.9 234.8 396.3 237.3C396.7 239.9 396.1 245.3 396.1 253.5V292.1C396.1 300.3 396.3 306.4 395.3 310.5C394.2 314.5 391.5 318.1 387.5 320.1C383.4 324 378.6 325.4 372.9 325.4C368.9 325.4 363.7 324.5 360.2 322.9C356.7 321.1 353.5 318.4 350.6 314.9L348.5 323.6L316.5 323.6zM361.6 302.9C362.3 301.1 362.6 296.9 362.6 290.4V255C362.6 249.4 362.3 245.5 361.5 243.8C360.8 241.9 357.8 241.1 355.7 241.1C353.7 241.1 352.3 241.9 351.6 243.4C351 244.9 350.6 248.8 350.6 255V291.4C350.6 297.5 351 301.4 351.8 303C352.4 304.7 353.9 305.5 355.9 305.5C358.1 305.5 360.1 304.7 361.6 302.9L361.6 302.9zM418.4 32.04C434.1 33.27 447.1 47.28 447.1 63.92V448.1C447.1 464.5 435.2 478.5 418.9 479.1C418.6 479.1 418.4 480 418.1 480H29.88C29.6 480 29.32 479.1 29.04 479.9C13.31 478.5 1.093 466.1 0 449.7L.0186 61.78C1.081 45.88 13.82 33.09 30.26 31.1H417.7C417.9 31.1 418.2 32.01 418.4 32.04L418.4 32.04zM30.27 41.26C19 42.01 10.02 51.01 9.257 62.4V449.7C9.63 455.1 11.91 460.2 15.7 464C19.48 467.9 24.51 470.3 29.89 470.7H418.1C429.6 469.7 438.7 459.1 438.7 448.1V63.91C438.7 58.17 436.6 52.65 432.7 48.45C428.8 44.24 423.4 41.67 417.7 41.26L30.27 41.26z"></path></svg>';


	return $icons;
}
add_filter( 'twenty_twenty_one_svg_icons_social', 'theme_custom_social_svg' );

function theme_custom_social_map( $icons ) {
	$icons['vsco'] = array(
		'vsco.co',
	);
	return $icons;
}
add_filter( 'twenty_twenty_one_social_icons_map', 'theme_custom_social_map' );

Hope that helps,
Yann

Hi, I see you have successfully added the IMDb icon. I’m therefore closing this thread.

Have a nice day.