actions-cookie-bite
Introduced in v2.3.0
Available in TYPO3
11.5
Buttons
Button Label Button Label
Button Label Button Label
Usage
Markup
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16"><g fill="currentColor"><path d="M6 5a1 1 0 1 0 0 2 1 1 0 0 0 0-2zM10 8a1 1 0 1 0 0 2 1 1 0 0 0 0-2zM6 9a1 1 0 1 0 0 2 1 1 0 0 0 0-2z"/><path d="M7.636 2.092a4.519 4.519 0 0 0 3.07 3.202 4.52 4.52 0 0 0 3.201 3.07c-.041.186-.08.371-.109.554a9.582 9.582 0 0 0-.073.629c-.041.436-.084.887-.262 1.236-.172.338-.497.626-.867.954-.151.135-.302.27-.449.417-.142.143-.277.293-.436.472-.305.343-.592.667-.929.839-.349.178-.801.221-1.238.262a10.1 10.1 0 0 0-.625.072c-.207.033-.415.078-.62.124-.353.077-.687.151-.998.151a1.65 1.65 0 0 1-.26-.019c-.379-.06-.753-.279-1.191-.536-.17-.099-.34-.197-.516-.288a9.872 9.872 0 0 0-.565-.259c-.402-.172-.818-.352-1.104-.637-.286-.286-.466-.703-.65-1.13-.08-.184-.159-.367-.247-.54a10.71 10.71 0 0 0-.309-.551c-.233-.398-.454-.774-.514-1.153-.061-.387.033-.81.135-1.269.045-.205.09-.409.121-.612.032-.204.052-.413.072-.625.041-.437.084-.889.263-1.239.171-.334.494-.621.837-.926.161-.144.323-.288.475-.44.146-.146.284-.3.441-.476.305-.343.592-.667.928-.838.35-.179.802-.221 1.241-.263.21-.02.419-.04.623-.072a8.35 8.35 0 0 0 .555-.109m.87-1.154c-.349.022-.689.09-1.02.163a9.409 9.409 0 0 1-.56.113 9.976 9.976 0 0 1-.56.064c-.507.048-1.082.101-1.603.367-.504.257-.869.667-1.222 1.065-.13.146-.261.294-.399.432-.139.139-.286.27-.433.399-.397.353-.807.718-1.064 1.221-.266.521-.32 1.096-.368 1.603a8.406 8.406 0 0 1-.063.56c-.03.187-.071.374-.113.562-.115.52-.234 1.057-.145 1.628.09.568.37 1.045.64 1.506.097.165.194.33.28.498.082.161.155.332.229.504.202.468.431.998.852 1.419.42.42.949.648 1.416.85.173.075.344.148.507.231.169.087.335.185.501.281.46.27.936.549 1.502.639.141.022.28.031.417.031.419 0 .822-.089 1.214-.176.187-.042.374-.083.56-.112a8.39 8.39 0 0 1 .562-.064c.507-.048 1.08-.102 1.601-.367.505-.257.87-.669 1.224-1.067.13-.145.26-.292.396-.43.138-.137.284-.267.43-.396.398-.354.81-.719 1.067-1.224.266-.521.319-1.095.367-1.601.018-.189.035-.378.064-.562.029-.186.07-.373.112-.56.073-.332.142-.672.164-1.022-.02.001-.04.007-.061.007a3.49 3.49 0 0 1-3.454-3.046A3.49 3.49 0 0 1 8.5 1c0-.021.006-.041.006-.062z"/></g></svg>Inline
<span class="icon icon-size-small icon-state-default">
<span class="icon-markup">
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16"><g fill="currentColor"><path d="M6 5a1 1 0 1 0 0 2 1 1 0 0 0 0-2zM10 8a1 1 0 1 0 0 2 1 1 0 0 0 0-2zM6 9a1 1 0 1 0 0 2 1 1 0 0 0 0-2z"/><path d="M7.636 2.092a4.519 4.519 0 0 0 3.07 3.202 4.52 4.52 0 0 0 3.201 3.07c-.041.186-.08.371-.109.554a9.582 9.582 0 0 0-.073.629c-.041.436-.084.887-.262 1.236-.172.338-.497.626-.867.954-.151.135-.302.27-.449.417-.142.143-.277.293-.436.472-.305.343-.592.667-.929.839-.349.178-.801.221-1.238.262a10.1 10.1 0 0 0-.625.072c-.207.033-.415.078-.62.124-.353.077-.687.151-.998.151a1.65 1.65 0 0 1-.26-.019c-.379-.06-.753-.279-1.191-.536-.17-.099-.34-.197-.516-.288a9.872 9.872 0 0 0-.565-.259c-.402-.172-.818-.352-1.104-.637-.286-.286-.466-.703-.65-1.13-.08-.184-.159-.367-.247-.54a10.71 10.71 0 0 0-.309-.551c-.233-.398-.454-.774-.514-1.153-.061-.387.033-.81.135-1.269.045-.205.09-.409.121-.612.032-.204.052-.413.072-.625.041-.437.084-.889.263-1.239.171-.334.494-.621.837-.926.161-.144.323-.288.475-.44.146-.146.284-.3.441-.476.305-.343.592-.667.928-.838.35-.179.802-.221 1.241-.263.21-.02.419-.04.623-.072a8.35 8.35 0 0 0 .555-.109m.87-1.154c-.349.022-.689.09-1.02.163a9.409 9.409 0 0 1-.56.113 9.976 9.976 0 0 1-.56.064c-.507.048-1.082.101-1.603.367-.504.257-.869.667-1.222 1.065-.13.146-.261.294-.399.432-.139.139-.286.27-.433.399-.397.353-.807.718-1.064 1.221-.266.521-.32 1.096-.368 1.603a8.406 8.406 0 0 1-.063.56c-.03.187-.071.374-.113.562-.115.52-.234 1.057-.145 1.628.09.568.37 1.045.64 1.506.097.165.194.33.28.498.082.161.155.332.229.504.202.468.431.998.852 1.419.42.42.949.648 1.416.85.173.075.344.148.507.231.169.087.335.185.501.281.46.27.936.549 1.502.639.141.022.28.031.417.031.419 0 .822-.089 1.214-.176.187-.042.374-.083.56-.112a8.39 8.39 0 0 1 .562-.064c.507-.048 1.08-.102 1.601-.367.505-.257.87-.669 1.224-1.067.13-.145.26-.292.396-.43.138-.137.284-.267.43-.396.398-.354.81-.719 1.067-1.224.266-.521.319-1.095.367-1.601.018-.189.035-.378.064-.562.029-.186.07-.373.112-.56.073-.332.142-.672.164-1.022-.02.001-.04.007-.061.007a3.49 3.49 0 0 1-3.454-3.046A3.49 3.49 0 0 1 8.5 1c0-.021.006-.041.006-.062z"/></g></svg>
</span>
</span>Sprite
<span class="icon icon-size-small icon-state-default">
<span class="icon-markup">
<svg role="img"><use xlink:href="dist/sprites/actions.svg#actions-cookie-bite" /></svg>
</span>
</span>TYPO3 ViewHelper
<core:icon identifier="actions-cookie-bite" size="small" />CSS Background Image
.myclass {
background-size: 1em 1em;
background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3cg fill='%23fff'%3e%3cpath d='M6 5a1 1 0 1 0 0 2 1 1 0 0 0 0-2zM10 8a1 1 0 1 0 0 2 1 1 0 0 0 0-2zM6 9a1 1 0 1 0 0 2 1 1 0 0 0 0-2z'/%3e%3cpath d='M7.636 2.092a4.519 4.519 0 0 0 3.07 3.202 4.52 4.52 0 0 0 3.201 3.07c-.041.186-.08.371-.109.554a9.582 9.582 0 0 0-.073.629c-.041.436-.084.887-.262 1.236-.172.338-.497.626-.867.954-.151.135-.302.27-.449.417-.142.143-.277.293-.436.472-.305.343-.592.667-.929.839-.349.178-.801.221-1.238.262a10.1 10.1 0 0 0-.625.072c-.207.033-.415.078-.62.124-.353.077-.687.151-.998.151a1.65 1.65 0 0 1-.26-.019c-.379-.06-.753-.279-1.191-.536-.17-.099-.34-.197-.516-.288a9.872 9.872 0 0 0-.565-.259c-.402-.172-.818-.352-1.104-.637-.286-.286-.466-.703-.65-1.13-.08-.184-.159-.367-.247-.54a10.71 10.71 0 0 0-.309-.551c-.233-.398-.454-.774-.514-1.153-.061-.387.033-.81.135-1.269.045-.205.09-.409.121-.612.032-.204.052-.413.072-.625.041-.437.084-.889.263-1.239.171-.334.494-.621.837-.926.161-.144.323-.288.475-.44.146-.146.284-.3.441-.476.305-.343.592-.667.928-.838.35-.179.802-.221 1.241-.263.21-.02.419-.04.623-.072a8.35 8.35 0 0 0 .555-.109m.87-1.154c-.349.022-.689.09-1.02.163a9.409 9.409 0 0 1-.56.113 9.976 9.976 0 0 1-.56.064c-.507.048-1.082.101-1.603.367-.504.257-.869.667-1.222 1.065-.13.146-.261.294-.399.432-.139.139-.286.27-.433.399-.397.353-.807.718-1.064 1.221-.266.521-.32 1.096-.368 1.603a8.406 8.406 0 0 1-.063.56c-.03.187-.071.374-.113.562-.115.52-.234 1.057-.145 1.628.09.568.37 1.045.64 1.506.097.165.194.33.28.498.082.161.155.332.229.504.202.468.431.998.852 1.419.42.42.949.648 1.416.85.173.075.344.148.507.231.169.087.335.185.501.281.46.27.936.549 1.502.639.141.022.28.031.417.031.419 0 .822-.089 1.214-.176.187-.042.374-.083.56-.112a8.39 8.39 0 0 1 .562-.064c.507-.048 1.08-.102 1.601-.367.505-.257.87-.669 1.224-1.067.13-.145.26-.292.396-.43.138-.137.284-.267.43-.396.398-.354.81-.719 1.067-1.224.266-.521.319-1.095.367-1.601.018-.189.035-.378.064-.562.029-.186.07-.373.112-.56.073-.332.142-.672.164-1.022-.02.001-.04.007-.061.007a3.49 3.49 0 0 1-3.454-3.046A3.49 3.49 0 0 1 8.5 1c0-.021.006-.041.006-.062z'/%3e%3c/g%3e%3c/svg%3e");
}Sass Background Variable
@import "@typo3/icons/dist/icons.scss";
@import "@typo3/icons/dist/scss/icons-variables-actions.scss";
.myclass {
background-size: 1em 1em;
background-image: $icon-actions-cookie-bite;
}